Account statement template, HTML and Handlebars
A monthly customer statement: opening balance, every invoice and payment, and the closing balance.
Free to copy. Send it from your app with POST /v1/pdfs/render and the slug account-statement.
Template source
<div class="page">
<div class="head">
<div><h1>STATEMENT</h1><p class="muted">{{statement.period}}</p></div>
<div style="text-align:right"><strong>{{company.name}}</strong><br><span class="muted">Account {{customer.account}}<br>{{customer.name}}</span></div>
</div>
<table class="items">
<thead><tr><th>Date</th><th>Detail</th><th class="num">Debit</th><th class="num">Credit</th></tr></thead>
<tbody>
{{#each entries}}
<tr><td>{{formatDate date "DD MMM"}}</td><td>{{detail}}</td><td class="num">{{#if debit}}{{formatCurrency debit "INR"}}{{/if}}</td><td class="num">{{#if credit}}{{formatCurrency credit "INR"}}{{/if}}</td></tr>
{{/each}}
</tbody>
</table>
<p class="num">Opening balance {{formatCurrency statement.opening "INR"}}</p>
<p class="total">Closing balance {{formatCurrency statement.closing "INR"}}</p>
</div>
<style>
@page { size: A4; margin: 18mm; }
body { font-family: Arial, Helvetica, sans-serif; color: #17181c; font-size: 12px; }
h1 { font-size: 22px; letter-spacing: 2px; margin: 0; }
.muted { color: #5a5c63; }
.head { display: flex; justify-content: space-between; margin-bottom: 24px; }
table.items { width: 100%; border-collapse: collapse; margin-top: 16px; }
table.items th { text-align: left; font-weight: normal; color: #5a5c63; border-bottom: 1.5px solid #17181c; padding: 6px 0; }
table.items td { padding: 8px 0; border-bottom: 1px solid #ece9e2; }
.num { text-align: right; font-variant-numeric: tabular-nums; }
.total { margin-top: 12px; text-align: right; font-size: 15px; font-weight: bold; }
</style>Sample data (JSON)
{
"company": {
"name": "Kestrel Foods Pvt Ltd",
"city": "Bengaluru, Karnataka",
"gstin": "29ABCDE1234F1Z5"
},
"customer": {
"name": "Priya Menon",
"account": "KF-CUST-0092"
},
"statement": {
"period": "September 2026",
"opening": 12400,
"closing": 8902.5
},
"entries": [
{
"date": "2026-09-03",
"detail": "Payment received, thank you",
"credit": 12400
},
{
"date": "2026-09-28",
"detail": "Invoice INV-2026-0142",
"debit": 49402.5
},
{
"date": "2026-09-30",
"detail": "Payment received, UPI",
"credit": 40500
}
]
}