Documentation Index

For the complete documentation index, see llms.txt. Markdown versions of docs pages are available through the page's alternate Markdown link.

Current page: Adding hero background image blocks to your email designs - You can add 🦸 Hero elements when you need to display a single column of rich text, buttons or other content elements on top of a background image.. Machine-readable page: /emailify/design/hero.md.

Adding hero background image blocks to your email designs

You can add 🦸 Hero elements when you need to display a single column of rich text, buttons or other content elements on top of a background image.

The quickest way to add a new Hero is either to add a preset starter component (mostly from the "CTA" tab) or to use the Quick Add Element dropdown at the bottom of the plugin to insert a new blank Hero layer to your email design, when your Emailify email Figma frame is selected.

This will add a brand new empty Hero layer with a placeholder background image fill set on it.

You can start populating it with content layers and customizing the styles (for example, adding a background, adjusting padding and spacing, etc) in Figma as needed.

If you need to use a background image for more than one column of content, you can also add background images to any 🚣 Row or 🎁 Wrapper layers, or apply one directly to individual 🏛️ Column layers.

🦸 Hero elements can only be added directly inside of ✉️ Email layers. 🦸 Hero elements cannot contain any 🏛️ Column layers, as it doesn't support multiple column layouts; instead, content layers are added directly inside of the frame, without needing any 🏛️ Column layers (unlike a 🚣 Row element).