Receipt — rendered output
npx @formepdf/html templates/receipt/index.html -o receipt.pdf
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Receipt RCT-9081 — Northmoor Industrial Group, Inc.</title>
<link rel="stylesheet" href="../northmoor-shared.css">
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="sheet">
<div class="atop"></div>
<div class="pagefill">
<header>
<div class="hd">
<div class="mast-left">
<div class="mark">N</div>
<div>
<div class="wm">Northmoor</div>
<div class="sub" style="margin-top: 3pt">Industrial Group, Inc.</div>
</div>
</div>
<div class="addr" style="text-align: right">418 Ellingham Road, Suite 300<br>Rochester, NY 14604<br>(585) 274-0180<br>ar@northmoorgroup.com</div>
</div>
<div class="hr2 mast-divider"></div>
<div class="dochead">
<div>
<div class="lbl lbl-accent" style="margin-bottom: 7.5pt">Accounts receivable · retain for your records</div>
<h1 class="dtitle">Receipt</h1>
</div>
<div class="stamp">Paid in full</div>
</div>
</header>
<div class="meta meta-doc">
<div><div class="lbl">Received from</div>Brightwater Foods LLC<br>2140 Carnegie Avenue<br>Cleveland, OH 44115</div>
<div><div class="lbl">Receipt no.</div>RCT-9081<div class="lbl meta-gap">Received</div>18 September 2026</div>
<div><div class="lbl">Method</div>ACH credit<div class="lbl meta-gap">Bank reference</div>8827194-03</div>
<div><div class="lbl">Posted by</div>D. Whitcomb<div class="lbl meta-gap">Value date</div>18 September 2026</div>
</div>
<table class="t items">
<thead>
<tr>
<th scope="col">Applied to</th>
<th scope="col">Reference</th>
<th scope="col" class="num" style="width: 72pt">Document</th>
<th scope="col" class="num" style="width: 72pt">Applied</th>
<th scope="col" class="num" style="width: 72pt">Balance</th>
</tr>
</thead>
<tbody>
<tr><td>Invoice INV-4417</td><td>PO 44-7712</td><td class="num">4,647.07</td><td class="num">4,046.59</td><td class="num">0.00</td></tr>
<tr><td>Credit note CN-0392</td><td>RMA-1188</td><td class="num">(600.48)</td><td class="num">(600.48)</td><td class="num">0.00</td></tr>
</tbody>
</table>
<table class="tt">
<tbody>
<tr><td>Invoiced</td><td class="num">4,647.07</td></tr>
<tr><td>Credits applied</td><td class="num">(600.48)</td></tr>
<tr class="total"><td>Cash received</td><td class="num">4,046.59</td></tr>
</tbody>
</table>
<div class="due">
<span class="lbl" style="color: #111111">Remaining balance</span>
<span class="due-figure">$0.00</span>
</div>
<div class="sigrow sig-receipt">
<div class="sigcell lbl" style="flex-grow: 1">Authorised signature</div>
<div class="sigcell lbl" style="flex-grow: 1">Date received — 18 September 2026</div>
</div>
<div class="pagefill-spacer"></div>
<footer class="foot">
<div style="flex-grow: 1"><div class="lbl">Retain for your records</div>This receipt evidences payment in full of the documents listed. No further amounts are outstanding on purchase order 44-7712.</div>
<div style="flex-grow: 1"><div class="lbl">Tax</div>Sales tax of 328.32 was charged on invoice INV-4417 and 44.48 reversed on credit note CN-0392; net tax remitted 283.84.</div>
</footer>
</div>
</div>
</body>
</html>
/* receipt — page geometry and document-specific rules.
* Spine comes from ../northmoor-shared.css. */
@page {
size: Letter;
margin: 52.5pt 57pt 40.5pt; /* 70px 76px 54px */
@bottom-left {
content: "Receipt RCT-9081 · Brightwater Foods LLC";
font-family: Helvetica, Arial, sans-serif;
font-size: 5.625pt;
letter-spacing: 0.14em;
text-transform: uppercase;
color: #8A857E;
}
@bottom-right {
content: "Page " counter(page) " of " counter(pages);
font-family: Helvetica, Arial, sans-serif;
font-size: 5.625pt;
letter-spacing: 0.14em;
text-transform: uppercase;
color: #8A857E;
}
}
/* First-page 4px full-bleed accent head rule (escapes into the margin). */
.sheet { position: relative; }
.atop {
position: absolute;
top: -52.5pt;
left: -57pt;
right: -57pt;
height: 3pt;
background-color: #7B2233;
}
.meta-doc { grid-template-columns: 1.4fr 1fr 1fr 1fr; }
.items { margin-top: 22.5pt; } /* 30px */
.sig-receipt { margin-top: 25.5pt; } /* 34px */
northmoor-shared.css alongside them — the set’s shared spine (type scale, tables, signature blocks, the accent).
Sample data (data.json)
Sample data (data.json)
data.json
{
"issuer": {
"name": "Northmoor Industrial Group, Inc.",
"address": "418 Ellingham Road, Suite 300, Rochester, NY 14604",
"phone": "(585) 274-0180",
"ein": "16-1904472",
"bank": {
"name": "First Genesee Bank, Rochester NY",
"account": "8841 002937",
"routing": "021304559"
},
"email": "ar@northmoorgroup.com"
},
"document": {
"type": "receipt",
"number": "RCT-9081",
"received": "18 September 2026",
"method": "ACH credit",
"bankReference": "8827194-03",
"postedBy": "D. Whitcomb",
"valueDate": "18 September 2026",
"stamp": "Paid in full"
},
"receivedFrom": {
"name": "Brightwater Foods LLC",
"lines": [
"2140 Carnegie Avenue",
"Cleveland, OH 44115"
]
},
"applied": [
{
"appliedTo": "Invoice INV-4417",
"reference": "PO 44-7712",
"document": 4647.07,
"applied": 4046.59,
"balance": 0.0
},
{
"appliedTo": "Credit note CN-0392",
"reference": "RMA-1188",
"document": -600.48,
"applied": -600.48,
"balance": 0.0
}
],
"totals": {
"invoiced": 4647.07,
"credits": -600.48,
"cashReceived": 4046.59,
"remainingBalance": 0.0
},
"tax": {
"charged": 328.32,
"reversed": 44.48,
"netRemitted": 283.84
}
}
MIT-licensed, free to copy — source on GitHub. Passes PDF/UA-1 validation (veraPDF) in CI; validation is a floor, not a certification.