Enter your loan details below to instantly calculate your monthly EMI, total interest paid, and a full amortization schedule — no sign-up required, everything runs in your browser.

Loan Details

  <div class="form-group">
    <label for="emi-amount">Loan Amount ($)</label>
    <input type="number" id="emi-amount" placeholder="e.g. 250000" min="1" step="1">
  </div>

  <div class="form-group">
    <label for="emi-rate">Annual Interest Rate (%)</label>
    <input type="number" id="emi-rate" placeholder="e.g. 6.5" min="0.01" step="0.01">
  </div>

  <div class="form-group">
    <label>Loan Term</label>
    <div class="input-row">
      <input type="number" id="emi-term" placeholder="e.g. 30" min="1" step="1">
      <div class="toggle-group" style="flex-shrink:0;">
        <button id="emi-term-years" class="active" onclick="emiSetTermUnit('years')">Yrs</button>
        <button id="emi-term-months" onclick="emiSetTermUnit('months')">Mo</button>
      </div>
    </div>
  </div>

  <div class="form-group">
    <label for="emi-start">Start Date</label>
    <input type="month" id="emi-start">
  </div>

</div>
<div class="error-msg" id="emi-error">Please fill in all fields with valid values.</div>
<button class="btn-primary" onclick="emiCalculate()">Calculate EMI</button>

<!-- Summary cards -->
<div class="summary-grid">
  <div class="summary-card highlight">
    <div class="sc-label">Monthly EMI</div>
    <div class="sc-value" id="res-emi">—</div>
    <div class="sc-sub">per month</div>
  </div>
  <div class="summary-card">
    <div class="sc-label">Total Interest</div>
    <div class="sc-value" id="res-interest">—</div>
    <div class="sc-sub" id="res-interest-pct">—</div>
  </div>
  <div class="summary-card">
    <div class="sc-label">Total Payment</div>
    <div class="sc-value" id="res-total">—</div>
    <div class="sc-sub" id="res-months-label">—</div>
  </div>
</div>

<!-- Principal vs Interest ratio bar -->
<div class="ratio-bar-wrap">
  <div class="ratio-label">
    <span id="ratio-principal-label">Principal</span>
    <span id="ratio-interest-label">Interest</span>
  </div>
  <div class="ratio-bar"><div class="ratio-bar-fill" id="ratio-bar-fill" style="width:50%"></div></div>
</div>

<!-- Charts -->
<div class="charts-row">
  <div class="chart-box">
    <h3>Breakdown</h3>
    <canvas id="donut-canvas" width="180" height="180"></canvas>
    <div class="donut-legend">
      <span><span class="legend-dot" style="background:#3b82f6"></span>Principal</span>
      <span><span class="legend-dot" style="background:#f97316"></span>Interest</span>
    </div>
  </div>
  <div class="chart-box">
    <h3>Balance Over Time</h3>
    <canvas id="line-canvas" width="460" height="220"></canvas>
  </div>
</div>

<!-- Amortization table -->
<div class="table-section">
  <div class="table-header">
    <h3>Amortization Schedule</h3>
    <div class="view-toggle">
      <button class="active" id="view-monthly-btn" onclick="emiShowView('monthly')">Monthly</button>
      <button id="view-yearly-btn" onclick="emiShowView('yearly')">Yearly</button>
    </div>
  </div>
  <div class="table-scroll">
    <table>
      <thead>
        <tr>
          <th>Period</th>
          <th>Payment</th>
          <th>Principal</th>
          <th>Interest</th>
          <th>Balance</th>
        </tr>
      </thead>
      <tbody id="amort-tbody"></tbody>
    </table>
  </div>
</div>

Loan A

Loan B

Please fill in all fields for both loans.
Related Tools
› Calculate compound interest → Compound Interest Calculator
› Track ROI → ROI Calculator
› Plan retirement → Pension Simulator