Skip to content

Order confirmation template, HTML and Handlebars

Confirm an order with every item, the total and the expected delivery date.

Free to copy. Send it from your app with POST /v1/emails/send and the slug order-confirmation.

Template source

<table role="presentation" width="100%" cellpadding="0" cellspacing="0" style="background:#f4f3ef;">
  <tr>
    <td align="center" style="padding:32px 16px;">
      <table role="presentation" width="600" cellpadding="0" cellspacing="0" style="max-width:600px;width:100%;background:#ffffff;border-radius:12px;">
        <tr>
          <td style="padding:40px;font-family:Arial,Helvetica,sans-serif;color:#17181c;">
            <p style="margin:0 0 24px;font-size:14px;font-weight:bold;">{{company.name}}</p>
            <h1 style="margin:0 0 16px;font-size:24px;">Order {{order.id}} confirmed</h1>
            <p style="margin:0 0 20px;font-size:15px;line-height:24px;">Thanks, {{customer.first_name}}. We are packing it now and it arrives by {{formatDate order.delivery "DD MMM YYYY"}}.</p>
            <table role="presentation" width="100%" style="font-size:14px;margin:0 0 24px;border-collapse:collapse;">
              {{#each items}}
              <tr><td style="padding:8px 0;border-bottom:1px solid #ece9e2;">{{qty}} × {{name}}</td><td align="right" style="border-bottom:1px solid #ece9e2;">{{formatCurrency amount "INR"}}</td></tr>
              {{/each}}
              <tr><td style="padding:12px 0;font-weight:bold;">Total</td><td align="right" style="font-weight:bold;">{{formatCurrency order.total "INR"}}</td></tr>
            </table>
            <a href="{{order_url}}" style="display:inline-block;background:#2f43c4;color:#ffffff;text-decoration:none;font-size:15px;padding:12px 20px;border-radius:8px;">View Order</a>
            <p style="margin:32px 0 0;padding-top:16px;border-top:1px solid #ece9e2;font-size:12px;line-height:18px;color:#5a5c63;">
              {{company.name}}, {{company.city}}. You are receiving this because you have an account with us.
            </p>
          </td>
        </tr>
      </table>
    </td>
  </tr>
</table>

Sample data (JSON)

{
  "company": {
    "name": "Kestrel Foods Pvt Ltd",
    "city": "Bengaluru, Karnataka",
    "gstin": "29ABCDE1234F1Z5"
  },
  "customer": {
    "first_name": "Priya"
  },
  "order": {
    "id": "KF-20931",
    "delivery": "2026-10-02",
    "total": 8240
  },
  "items": [
    {
      "name": "Masala Chai 250 g",
      "qty": 10,
      "amount": 960
    },
    {
      "name": "Rolled Oats 1 kg",
      "qty": 20,
      "amount": 3980
    },
    {
      "name": "Jaggery Powder 500 g",
      "qty": 30,
      "amount": 3300
    }
  ],
  "order_url": "https://shop.example.com/orders/KF-20931"
}

More templates like this