Back to all templatesReceipt
ReceiptPayment
This is a screenshot of the compiled email. To view a live in browser version of the email click the "Live" button.
This is the pre-compiled code. It needs to be compiled via Bootstrap Email to build it for use in emails. You can do so by clicking the "Open in Editor" button, programmatically compile, or use the already compiled version by clicking the "Download Compiled" button.
<body class="bg-light">
<div class="container">
<img class="ax-center my-10 w-24" src="https://assets.bootstrapemail.com/logos/light/square.png" />
<div class="card p-4 p-lg-10 mb-6">
<h3 class="text-center">Receipt from HipCorp</h3>
<p class="text-center text-muted">Invoice #1234-5678</p>
<p class="text-center text-muted">Receipt #ABCD-EFGH</p>
<div class="row gap-y-4 gap-y-lg-0 my-6">
<div class="col-lg-4">
<div class="text-muted text-xs">AMOUNT PAID</div>
<div class="text-gray-700">$42.00</div>
</div>
<div class="col-lg-4">
<div class="text-muted text-xs">DATE PAID</div>
<div class="text-gray-700">August 28, 2021</div>
</div>
<div class="col-lg-4">
<div class="text-muted text-xs">PAYMENT METHOD</div>
<div class="text-gray-700">Visa - 4242</div>
</div>
</div>
<div class="text-muted text-xs">SUMMARY</div>
<table class="bg-light rounded p-4 w-full">
<tbody>
<tr>
<td>Cool Sunglasses</td>
<td class="text-right">$20.00</td>
</tr>
<tr>
<td>Trucker Hat</td>
<td class="text-right">$22.00</td>
</tr>
<tr>
<td class="fw-700 border-top">Amount paid</td>
<td class="fw-700 text-right border-top">$22.00</td>
</tr>
</tbody>
</table>
<hr class="my-6">
<p>If you have any questions, contact us at <a href="https://bootstrapemail.com">HipCorp@example.com</a>.</p>
</div>
</div>
</body>