Summer Sale Email Template — Retail Promo

A summer sale email template with a diagonal color-block hero — bright orange and teal, a gradient headline, and a chunky CTA — followed by category discounts, a copyable code, and a themed footer.

Promotional retailboldcolorfulgeometricctaseasonal

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 plED3VwA7jj5xe8e6hAcg and rebrand. For the full model, point an MCP agent at get_conceptemail-structure, layouts-vs-emails, design-recipes.

The email that makes your summer sale impossible to scroll past. A diagonal color-block hero splits bright orange and teal, the offer lands in a gradient headline stacked over an outlined line, and a bold button drops readers straight into the sale — then a tight run of category discounts, a copyable code, and one clear CTA close the deal. Loud, sunny, and built to move stock.

Snapshot

  • Goal: drive clicks to a seasonal storewide sale and clear summer stock fast.
  • Audience & tone: shoppers and subscribers mid-summer. Loud, playful, high-energy — bright and bold without tipping into noise.
  • Palette: page #fff7ed · container #ffffff · text #1c1917 / #78716c (muted) · accent orange #ea580c + teal #0d9488 (hero gradient #ea580c#f59e0b)
  • Font: "Trebuchet MS", Verdana, sans-serif
  • Artwork: one color-block-diagonal layout hero (a single rasterized image). 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.

  1. [layout] Color-block diagonal hero — apply the color-block-diagonal layout template on a 600 × 360 canvas; recolor the field block to orange #ea580c, the rotated block to teal #0d9488, the gradient headline line to #ea580c#f59e0b, the outlined line’s stroke to teal #0d9488, and the CTA fill to orange #ea580c (white label). Overlay copy: eyebrow “SUMMER SALE”, gradient line “Up to 40% off”, outlined line “all summer long”, button “Shop now”. Text-only artwork — the working CTA is step 6.
  2. [native] Heading — text. “Sun’s out, prices down” fontSize: 24, fontWeight: 700, color #1c1917, center.
  3. [native] Intro copy — text. “Swimwear, sandals, sunnies and more — up to 40% off while summer lasts.” fontSize: 15, color #78716c, center, line-height: 1.6.
  4. [native] Category discounts — text (one block). “Beachwear — 40% off / Footwear — 30% off / Accessories — 25% off”, each category name a bold orange #ea580c lead-in on its own line. fontSize: 15, color #78716c, left, line-height: 1.9.
  5. [native] Promo code — text. “Use code SUNNY40” fontSize: 20, bold, color #ea580c, center, letter-spacing: 2, on a #fff7ed tinted band. Its own block, never baked into the hero.
  6. [native] CTA button — button. Label “Shop summer”, orange #ea580c fill, white text, rounded corners, center → the sale page.
  7. [native] Footer — social + address. Recolor both to the palette: social.color = #ea580c, address.color = #94a3b8, address.fontFamily = "Trebuchet MS", Verdana, sans-serif. Without this they fall back to a generic brand-blue that clashes with the orange.

Make it yours

  1. Swap the offer — “Up to 40% off”, the “SUNNY40” code, and the three category lines — for your own sale and stock.
  2. Rewrite the hero’s two headline lines to your seasonal hook, keeping the gradient-over-outline pairing.
  3. Recolor the orange-and-teal split to your brand’s two-color pop — keep the diagonal block and one loud CTA.
Use this template