Order Confirmation Email Template — Line Items and Totals
Line items with description, quantity and amount in tabular figures, then subtotal, shipping and total with the total set off by a heavier rule.
Preview unavailable — view the prompt below.
The prompt
Two ways to build this email in plain language. The fastest is Temway's in-editor assistant — open the chat drawer in the email editor and paste the recipe below. Or connect Claude or ChatGPT via Temway's MCP and paste it there; the agent builds the email step by step. Either way, adapt the copy and colors to your brand.
- An email is a top-to-bottom stack of blocks — the recipe follows that order.
- A
[layout]step becomes a single image (great for heroes); everything else stays live text and links. - Theme the footer to match — the recipe's last step does exactly that.
Want this exact email? Click Use this template below to clone
it into your workspace, then ask the in-editor assistant to rebrand it. Over MCP, tell
your agent to clone the Temway share kurMjt9Z8-vI76MBvrlxC and rebrand. For the
full model, point an MCP agent at get_concept — email-structure,
layouts-vs-emails, design-recipes.
An order confirmation is the most-opened email you will ever send, and often the one a customer digs up months later. It should read like a document: amounts aligned in a column, one rule separating the items from the totals, and a heavier rule under the number that matters.
Snapshot
- Goal: confirm exactly what was bought and for how much, in a form that survives being searched for in six months.
- Audience & tone: a customer who has just paid. Factual and complete — no marketing in the first screen.
- Palette: page
#e5e5e5· container#f8f8f8· text#08090a/#686969(muted) · accent#33383d - Font:
Arial, Helvetica, sans-serif - Artwork: one
order-summarylayout hero (a single rasterized image), 600×620 — Receipt as a tear-off ticket: punched notches straddling its long edges and a dashed perforation across the foot, with the order number in tracked capitals, the total at display scale in tabular figures, and the discount stated on one line in the derived second hue. The itemised rows belong in native text blocks under the raster. Everything below it is native, selectable, clickable.
Build recipe
Each step is one block in the flat stack, top to bottom.
[native]= a real email block.[layout]= a free-form layout embedded as a single image.
- [native] Story title — text. “Order 4821 is confirmed”, fontSize: 20, color
#08090a, left. - [native] Body copy 1 — text. “Paid March 12 with the card ending 4417.”, fontSize: 16, color
#08090a, left. - [layout] Layout hero —
order-summary— apply theorder-summarylayout template (600×620). Receipt as a tear-off ticket: punched notches straddling its long edges and a dashed perforation across the foot, with the order number in tracked capitals, the total at display scale in tabular figures, and the discount stated on one line in the derived second hue. The itemised rows belong in native text blocks under the raster. Alt text: “Order 4821 receipt: total 82.00, including an 8.00 discount.”. - [native] Body copy 2 — text. “Total paid: 82.00.”, fontSize: 16, color
#08090a, left. - [native] Rule — divider. full-measure rule, 1px, color
#e9e9e9. - [native] Body copy 3 — text. “Shipping to 218 Cedar Street, Portland, OR 97204.”, fontSize: 16, color
#08090a, left. - [native] Body copy 4 — text. “Arriving Thursday, standard delivery.”, fontSize: 16, color
#08090a, left. - [native] Primary CTA — button. Label “Check delivery status”, fill
#33383d, color#ffffff, shapeStyle: ‘0_1’, left. - [native] Body copy 5 — text. “Need something changed? Reply within the hour and we can usually still catch it before it ships.”, fontSize: 16, color
#686969, left. - [native] Footer rule — divider. short (96px) rule, 1px, color
#e9e9e9. - [native] Footer social — social. Icon row, social.color
#33383d, style circle-outline, center. - [native] Footer address — address. Postal address + unsubscribe, address.color
#686969, address.fontFamilyArial, Helvetica, sans-serif, center.
Make it yours
- Keep the order number and the total as native text as well as in the artwork. A receipt whose numbers only exist inside a PNG is unsearchable and unreadable to a screen reader.
- Swap the graphite accent for your brand hue if you like — but resist a bright one here. A receipt is not a promotion.
- Put the tracking CTA below the totals, never above them.
About transactional email templates
Transactional email gets the highest open rates of any category, because recipients expect and want it — an order confirmation or shipping update gets read almost every time it lands. That makes it a branding opportunity most teams under-invest in relative to promotional email.
See all transactional templates →Why bother designing a transactional email — isn't the information all that matters?
Transactional emails have the highest open rates of any email you send, because recipients expect and want them — that makes them a real branding opportunity most teams under-invest in relative to promotional email.
What information has to be in an order confirmation email?
Order number, itemized contents, total charged, and expected delivery or next steps at minimum — the order-summary template below leads with those before anything promotional.
Can I add an upsell or review request to a transactional template?
Yes, but keep it secondary — the templates below place the transactional information first and any cross-sell or review ask below the fold, so it never competes with the confirmation itself.
Do these transactional templates work for both order and account-related events?
Yes — the collection below covers order confirmations and shipping updates as well as payment receipts and return confirmations, so both commerce- and account-triggered sends are covered.