SolaceThermasol Design System
Brand
Scheme

Applications

Email

Every email should read like a quiet, well-set page — warm, editorial, and unhurried, never a promotional blast.

Layout & structure

Build emails as a single column with generous whitespace. One idea per email, one clear path to act. Lead with hero photography, follow with a short block of copy, then a single button. Let the message breathe rather than packing it with modules.

DoDon't
Single-column layoutMulti-column grids that break on mobile
Generous whitespace and quiet marginsDense, edge-to-edge blocks
One idea and one primary actionCompeting CTAs and stacked offers
Hero image, copy, then buttonMagazine-style layouts with navigation tabs
Light warm footer (#F8F6F3)Heavy, dark, busy footers

Typography in email

Headlines are set in The Seasons Regular (400) — never italicized, never ALL CAPS. Body copy is Poppins Light (300) at 15px with a line-height of 1.8 for an open, readable feel.

Email clients are inconsistent, so font delivery matters. Embed The Seasons locally via @font-face — never rely on the fallback for emails. Pull Poppins from Google Fonts, and always declare web-safe fallbacks so the email holds its shape when custom fonts fail.

RoleTypefaceWeb-safe fallback
HeadlinesThe Seasons Regular (400), embeddedGeorgia, serif
BodyPoppins Light (300), 15px / 1.8Helvetica, Arial, sans-serif

Color usage

Use the warm palette for all consumer and dealer communications — it should feel inviting, never clinical. Reserve the cool palette for B2B only.

TokenHexUse
Obsidian#2D2925Text and primary button background
Solace#CBC0ACAccents and dividers
Umber Haven#E8E4DCSecondary backgrounds
Footer warm#F8F6F3Footer background

Keep B2C warm. Cool tones read as cold and sterile in the inbox and pull the brand off its quiet, golden register.

Imagery

Photography sets the tone before a word is read. Lead with warmth and emotion, and show finished spaces — not product specs.

DoDon't
Warm, golden, natural lightBlue-white or clinical lighting
Finished, beautiful spacesConstruction or installation in progress
Natural materials — wood, stone, glassProduct-only catalog shots
Emotion over productHarsh flash photography

Because many clients block images by default, never let the message depend on a picture. Carry the meaning in live text and write alt text for every image.

Subject line & copy voice

Confident without arrogance, warm and sensory, aspirational but achievable. Open with a hook, add a line or two of context, then a soft invitation. Use font-weight for emphasis rather than italics or asterisks, and keep bold sparing.

DoDon't
Confident without arroganceSalesy or promotional language
Warm, sensory, aspirational"Revolutionary," "game-changing," "best-in-class"
Soft invitationsAggressive calls to action
Story beyond the productTechnical jargon without context
Plain, quiet subject linesALL CAPS, exclamation points, or emoji clutter

In the spirit of the approved phrases — Make space to live well. Wellness begins at home. Breathe deep. Steam well.

CTA buttons

One primary button per email. Use an Obsidian background (#2D2925) with white text, or an outlined button with an Obsidian border. Solace works as a warm accent on dark backgrounds. Label the action with a calm, editorial phrase — "Discover what's possible," not "Buy now."

PropertyValue
BackgroundObsidian #2D2925
TextWhite, Poppins
AlternateOutlined with Obsidian border
Accent on darkSolace #CBC0AC

Accessibility

The email should work for everyone, in every client.

  • Write descriptive alt text for every image; leave purely decorative images with empty alt.
  • Keep body text at 15px or larger and line-height open at 1.8.
  • Ensure text-to-background contrast meets WCAG AA — Obsidian on warm light backgrounds passes; pale text on pale grounds does not.
  • Carry the core message in live text so it survives blocked images.
  • Use a logical heading order and meaningful link text, never "click here."

Pre-send checklist

#Check
1Single column, one idea, one primary action
2The Seasons embedded; Poppins and web-safe fallbacks declared
3Warm palette for B2C; cool reserved for B2B
4Imagery warm and golden, never clinical
5Message holds with images blocked
6Alt text on every image; contrast meets AA
7Subject line quiet and editorial — no caps, exclaims, or emoji
8No italics or asterisk emphasis; bold used sparingly
9Footer on light warm #F8F6F3
10Brand rendered as "Thermasol" throughout