Email Theme
Set your organization's default colors, font, and email width so every new template starts from a consistent baseline.
The email theme is your organization's default design system for all emails. It defines the baseline colors, font, and width that every new template inherits — giving your emails a consistent look without configuring each one from scratch.
Accessing the theme
Open Settings > Organization > Email Theme to view and edit your theme settings.
Theme settings
Settings > Organization > Email Theme exposes four controls. These are the only theme values stored at the organization level — every new template starts from them.
| Setting | What it controls | Default |
|---|---|---|
| Primary Color | Buttons and call-to-action elements | #c4785a (terracotta) |
| Background Color | The background color of your email body | #ffffff (white) |
| Font Family | The default typeface for text content | Arial, sans-serif |
| Email Width | Maximum width of your email on desktop (400–800px) | 600px |
The page shows a live preview alongside the form, plus a Reset to Defaults button. Hex colors are validated before you can save.
How the theme works with templates
The theme sets the starting point — every new template picks up your theme's colors, font, and width. From there, individual blocks carry their own explicit styling, and any value set on a block always wins over the theme.
Think of it as a cascade:
- Theme defines organization-wide defaults (primary color, background, font, width)
- Individual blocks override those defaults for specific content
There is no separate per-template theme object — a template stores its blocks, and those blocks' explicit values take priority over the theme defaults.
Beyond the theme settings
The rendering engine's EmailTheme type (packages/shared/src/types/editor.ts) supports many more design tokens than the four exposed in Settings > Organization > Email Theme — heading fonts, body text color, link color, border radius, spacing unit, and per-block-type defaults (blockDefaults). These apply only when a richer theme object is passed to the renderer programmatically; they are not currently editable from the settings page.
These extended tokens and block defaults are renderer capabilities, not settings-page fields. If you build emails through the dashboard, only the four core tokens above apply automatically.
When a fuller theme is supplied to the renderer, block defaults work as a cascade: theme.blockDefaults[type] is shallow-merged into each block's content before rendering, and any value the block author set explicitly always takes priority (packages/email-renderer/src/renderer.ts).
Set your theme early, before building templates. It's much easier to start with the right defaults than to go back and update every template later.
Practical examples
Consistent branding
Set your primary color to match your brand, choose your brand font, and pick a background color that works with your website. Every email your team creates will start with these settings.
Seasonal updates
During a holiday promotion, you might temporarily change your primary color to a festive shade. All new templates will inherit the updated palette.
Changing the theme doesn't retroactively update existing templates. It only affects new templates and new blocks added to existing templates.
Next steps
- Email Editor — build emails that inherit your theme
- Email Templates — create templates with your theme's styling
- Saved Blocks — save themed blocks for reuse