Styling Components
Styling Your Email Components
The Appearance Tab
Use the Appearance tab to control the look and feel of your email design
Padding
How to use Figma Auto Layout to control padding on wrappers, columns, and content elements
Background Colors
How to set outer, content, section, and dark mode background colors in the Email Love Plugin
Aligning Frames & Content
Learn how to align your content vertically and horizontally
Full-Width Background Color
Set a full-width background color for one of your components.
Corner Radius
How to add rounded corners to images, buttons, and sections — including Outlook limitations and multi-section card layouts
Optimize Your Email for Dark Mode
Customize how your email looks in dark mode on iOS devices
Typography
Get your email typography looking just right
Hero Sections
How to build effective hero sections with background images, side-by-side layouts, and mobile-friendly designs
Background Images in Email
How to use mj-hero-image for background images, with Outlook VML handled automatically and dark mode considerations
Element Reference: Spacer & Divider
Control spacing and visual separation in your emails
Element Reference: Button
Everything you need to know about the mj-button component
Element Reference: Text
Everything you need to know about the mj-text component
Powered by