Directives
Directives
Special block-level content sections for email layout.
Directives are special block-level sections that control the email layout. They use the ::: fenced container syntax:
::: directive
Content goes here
:::Available Directives
| Directive | Description |
|---|---|
| header | Content above the main body (logos, brand images) |
| hero | Full-width section with background image |
| callout | Highlighted tip or note |
| highlight | Emphasized content block |
| centered | Center-aligned text |
| footer | Footer with links and legal text |
Parameters
Some directives accept space-separated parameters after the directive name to customize alignment, padding, and colors:
::: callout center
Centered callout content
:::
::: highlight center compact bg=#dc2626
Compact, centered highlight with custom background
:::| Parameter | Syntax | Values | Applies To |
|---|---|---|---|
| align | Bare keyword | center, left, right | callout, highlight, header, footer |
| padding | Bare keyword | compact, spacious | callout, highlight |
| color | color=<hex> | Any hex color | callout, highlight, centered, header, footer |
| bg | bg=<hex> | Any hex color | callout, highlight |
See each directive's page for detailed examples.