The system
Nine emails. Three brands. One codebase.
This is the product. Every email below is real, hand-built HTML from the same component library. The brands are fictional; the technique is what a client receives.
Live HTML, rendered as an email client would. Imagery is placeholder.
Components
Fourteen parts, every email.
A client system typically runs to sixteen or twenty. Every one is available in the Composer, with personalisation and export for six email platforms.
- 01DocumentDoctype, Outlook settings, colour-scheme declaration, mobile and dark-mode styles. Written once, never touched by your team.
- 02Preview textHidden preheader with padding characters, so the inbox shows your line and nothing else.
- 03HeaderBrand name and a context label. Text, not an image, so it survives image blocking and dark mode.
- 04HeroFull-width image with alt text and fluid sizing.
- 05Text blockEyebrow, heading and body. Type, colour and tracking come from tokens.
- 06ButtonBulletproof: VML for Outlook, styled link everywhere else. Radius from tokens.
- 07DetailsRuled label and value rows for bookings, orders and reservations.
- 08Two-upPaired image, title, text and link. Side by side on desktop, stacked on mobile.
- 09Divider and noteHairline rule and small print, in the brand's rule and muted colours.
- 10ProductsTwo to four products with image, name, price and link, stacking on mobile.
- 11QuoteA guest, critic or press line set in the display face with an accent rule.
- 12EventDate block, title, time, place and RSVP link. Built for invitations and supper clubs.
- 13Offer codeA dashed panel with the code in monospace and the terms beneath, readable without images.
- 14FooterPreference, unsubscribe and privacy links, postal address. Marketing and transactional variants.
Your brands, in this system, in eight weeks.
Your tokens, your journeys, delivered into your ESP with locked structure and editable content.