Optimize your email designs for mobile with per-device styles, stacking, and show/hide controls.
Over 60% of emails are now opened on mobile devices. An email that looks stunning on desktop but requires pinching and zooming on an iPhone isn’t just annoying, it’s a conversion killer. This guide covers everything you need to know about optimizing your Email Love designs for mobile.The good news: MJML makes your emails responsive by default. Multi-column layouts automatically stack on mobile. But “responsive by default” isn’t the same as “optimized for mobile.” There’s a lot you can do to make the mobile experience genuinely great.
When your email is opened on a mobile device, the email client applies responsive breakpoints that transform your layout. Here’s what happens automatically:
Columns stack vertically: A three-column desktop layout becomes three stacked rows on mobile
Images scale: Images resize to fit the screen width
Text reflows: Text wraps within the new column width
The default MJML breakpoint is 480px. Below this width, multi-column layouts collapse to single-column.
Important: You cannot change the responsive breakpoint in the Email Love plugin. It’s fixed at 480px, which covers virtually all mobile devices.
This 480px width is MJML’s own column-stacking breakpoint and isn’t adjustable. The separate breakpoint that controls when your Mobile Styles tab settings (padding, font size, alignment, hide/show) switch on is adjustable per template. See Mobile Breakpoint below.
The Mobile Styles tab is where the magic happens. Select any component in your Figma design, open the Email Love plugin, and click on Mobile Styles. Here’s what you can control:
What’s comfortably readable at 16px on a desktop monitor might be too small on a phone held at arm’s length. Use the Mobile Styles tab to bump font sizes for mobile:
Body text: 16–18px minimum on mobile (even if you use 14px on desktop)
Headlines: Scale down proportionally, but keep them readable. A 36px desktop headline might become 24–28px on mobile
Buttons: Keep button text at 16px minimum with generous padding for easy tapping
Left-aligned text on desktop sometimes works better center-aligned on mobile, especially for short headlines and CTAs. The Mobile Styles tab lets you override alignment per component.
Every template switches from desktop to mobile styles at a breakpoint width, and it’s no longer a single fixed value for every design. Select your Main Frame, open Mobile Styles, and set a pixel value in the new Breakpoint field, or leave it blank to use the frame’s own width. You can also save your current value as the default for every new template you create.See Setting a Custom Mobile Breakpoint for the full walkthrough, including how the saved default works.
Images that look sharp on mobile need to be exported at 2x resolution. If your image displays at 300px wide on mobile, the source file should be 600px wide. This ensures crisp rendering on retina displays.
Many mobile email clients block images by default, especially in corporate environments. Alt text ensures your message still communicates even without visuals. Write alt text that describes the image’s purpose, not just its appearance.
If you set a button to Fill sizing in Figma (so it stretches to fill its column), the plugin automatically enables full-width on mobile. No need to toggle it manually. Buttons set to Hug or Fixed width stay at their set width on mobile. You can always override this in the Mobile Styles tab.
When columns stack on mobile, they stack left-to-right by default. A three-column layout with columns A | B | C becomes A (top), B (middle), C (bottom) on mobile. Design your column order with this stacking behavior in mind.You can control stacking behavior using the How to Control How Content Stacks on Mobile article.
While the plugin supports multi-column responsive layouts, single-column emails are inherently mobile-friendly. If your content doesn’t require side-by-side comparison, consider a single-column approach that looks identical on desktop and mobile.
The Email Love plugin includes a mobile preview mode:
Click the Preview button in the plugin
Toggle between Desktop and Mobile views
Review your design at mobile dimensions
Check that stacked columns read in the right order
Verify that hidden/shown content appears correctly
For the most accurate mobile testing, export your HTML and test with Litmus, Email on Acid, or InboxMonster. These tools show real-device rendering across dozens of email clients and mobile devices.
”My email looks great on desktop but the mobile text is tiny”
You probably haven’t set mobile-specific font sizes. Select your text components and adjust the font size in the Mobile Styles tab. Body text should be at least 16px on mobile.
Make sure your columns are inside a properly structured MJML section. Verify the MJML structure is correct. Also check that you haven’t set columns to “force desktop” layout.
Image widths in email are set in pixels, not percentages. If your image is 640px wide but the mobile screen is 375px, the image should scale down automatically with MJML. If it’s not scaling, check that the image is inside a properly structured mj-column.
Desktop padding doesn’t automatically adjust for mobile. Set separate mobile padding values in the Mobile Styles tab. A 48px desktop side-padding should drop to 16–20px on mobile.Need help optimizing for mobile? Reach out at support@emaillove.com or join our Slack.
{"docsConfig":{"theme":"mint","$schema":"https://mintlify.com/docs.json","name":"Email Love","colors":{"primary":"#E81A3F","light":"#EE3F5E","dark":"#EB3656"},"logo":{"light":"https://mintcdn.com/emaillove/zdvKWcm2hTqSKqVZ/logo/light.png?fit=max\u0026auto=format\u0026n=zdvKWcm2hTqSKqVZ\u0026q=85\u0026s=1d0cc0df4e2036624a1a61cb4e0a6938","dark":"https://mintcdn.com/emaillove/zdvKWcm2hTqSKqVZ/logo/dark.png?fit=max\u0026auto=format\u0026n=zdvKWcm2hTqSKqVZ\u0026q=85\u0026s=1ea50a0749925dca8777790b59abb046"},"favicon":"https://mintcdn.com/emaillove/zdvKWcm2hTqSKqVZ/favicon.png?fit=max\u0026auto=format\u0026n=zdvKWcm2hTqSKqVZ\u0026q=85\u0026s=0c16739dc1b58fa00ba58481eae48d5b","seo":{"metatags":{"canonical":"https://help.emaillove.com"}},"fonts":{"family":"Inter"},"integrations":{"plausible":{"domain":"help.emaillove.com"}},"interaction":{"drilldown":false},"styling":{"latex":true},"navigation":{"global":{"anchors":[{"anchor":"Community","icon":"slack","href":"https://emaillove.com/go/slack"}]},"pages":[]}},"deployment":{"deploymentMetadataValue":{"subdomain":"emaillove","hasAudioNarration":false,"actualSubdomain":"emaillove","customDomains":["help.emaillove.com"],"gitSource":{"type":"github","owner":"email-love","repo":"docs","deployBranch":"main","contentDirectory":"","isPrivate":true,"mountPath":"","label":""},"entitlements":{},"buildId":"6af15bb174019a804019ccee","clientVersion":"0.0.4094","searchFilterCounts":[{"language":"default","tag":"Documentation","count":147},{"language":"default","tag":"Figma Plugin","count":115},{"language":"default","tag":"Builder","count":32},{"language":"default","tag":"ESP Integrations","count":32},{"language":"default","tag":"Building with Components","count":13},{"language":"default","tag":"Styling","count":13},{"language":"default","tag":"Editor","count":8},{"language":"default","tag":"AI Studio","count":8},{"language":"default","tag":"Images \u0026 Media","count":8},{"language":"default","tag":"How It Works","count":7}]},"assistantConfig":{},"basePath":"","hasChatPermissions":false,"hasWebMcpPermissions":false,"toggles":[{"name":"kill-isr","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"agent-mintlify-slack","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"agent-integrations-settings","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"rbac-expansion","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"automations-pr-grouping","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"custom-prefix","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"analytics-v7","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"user-flows-analytics","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"no-publish-flow","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workos-onboarding","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"llms-txt-v2","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"snapshot-serving-live","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"stripTemperatureMiddleware","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"support-platform-pylon-zendesk","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"snapshot-serving","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"instant-rollback","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"granular-notifications-server","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"granular-notifications","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"automations-fable","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"fixed-ai-action-pricing","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"automation-resolve-merge-conflict","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"scoped-publishing","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"mintql","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"page-level-analytics","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"editor-version-history-v2","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"billing-page-v2","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"full-page-search","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workspace-projects","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"assistant-v5","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"fork-pr-previews","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"revalidation-jwt","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workos-sso-scim","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"hobby-abuse-scan","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"dashboard-inbox","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workos-signup","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"turbopuffer-dual-write","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workos-enabled","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"approve-review-flow","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"editor-metadata","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"sso-setup-deadline-banner","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"turbopuffer-serve","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"live-agents","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"comment-mode","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false}],"googleFontsInlined":false},"customCss":[],"page":{"pagePath":"plugin/mobile/overview","slug":"/plugin/mobile/overview","pageMetadata":{"title":"Mobile Optimization","description":"Optimize your email designs for mobile with per-device styles, stacking, and show/hide controls.","href":"/plugin/mobile/overview"},"description":{"compiledSource":"\"use strict\";\nconst {jsx: _jsx} = arguments[0];\nconst {useMDXComponents: _provideComponents} = arguments[0];\nfunction _createMdxContent(props) {\n const _components = {\n p: \"p\",\n ..._provideComponents(),\n ...props.components\n };\n return _jsx(_components.p, {\n children: \"Optimize your email designs for mobile with per-device styles, stacking, and show/hide controls.\"\n });\n}\nfunction MDXContent(props = {}) {\n const {wrapper: MDXLayout} = {\n ..._provideComponents(),\n ...props.components\n };\n return MDXLayout ? _jsx(MDXLayout, {\n ...props,\n children: _jsx(_createMdxContent, {\n ...props\n })\n }) : _createMdxContent(props);\n}\nreturn {\n default: MDXContent\n};\n","frontmatter":{},"scope":{}},"pageType":"default","mdx":{"mdxSource":{"compiledSource":"\"use strict\";const{Fragment:_Fragment,jsx:_jsx,jsxs:_jsxs}=arguments[0];const{useMDXComponents:_provideComponents}=arguments[0];function _createMdxContent(props){const _components={a:`a`,em:`em`,li:`li`,ol:`ol`,p:`p`,strong:`strong`,ul:`ul`,..._provideComponents(),...props.components},{Heading,Tip,Warning}=_components;if(!Heading)_missingMdxReference(`Heading`,true);if(!Tip)_missingMdxReference(`Tip`,true);if(!Warning)_missingMdxReference(`Warning`,true);return _jsxs(_Fragment,{children:[_jsx(_components.p,{children:`Over 60% of emails are now opened on mobile devices. An email that looks stunning on desktop but requires pinching and zooming on an iPhone isn’t just annoying, it’s a conversion killer. This guide covers everything you need to know about optimizing your Email Love designs for mobile.`}),`\n`,_jsx(_components.p,{children:`The good news: MJML makes your emails responsive by default. Multi-column layouts automatically stack on mobile. But “responsive by default” isn’t the same as “optimized for mobile.” There’s a lot you can do to make the mobile experience genuinely great.`}),`\n`,_jsx(Heading,{level:`2`,id:`how-mobile-rendering-works`,children:`How Mobile Rendering Works`}),`\n`,_jsx(_components.p,{children:`When your email is opened on a mobile device, the email client applies responsive breakpoints that transform your layout. Here’s what happens automatically:`}),`\n`,_jsxs(_components.ul,{children:[`\n`,_jsxs(_components.li,{children:[_jsx(_components.strong,{children:`Columns stack vertically:`}),` A three-column desktop layout becomes three stacked rows on mobile`]}),`\n`,_jsxs(_components.li,{children:[_jsx(_components.strong,{children:`Images scale:`}),` Images resize to fit the screen width`]}),`\n`,_jsxs(_components.li,{children:[_jsx(_components.strong,{children:`Text reflows:`}),` Text wraps within the new column width`]}),`\n`]}),`\n`,_jsx(_components.p,{children:`The default MJML breakpoint is 480px. Below this width, multi-column layouts collapse to single-column.`}),`\n`,_jsx(Warning,{children:_jsxs(_components.p,{children:[_jsx(_components.strong,{children:`Important:`}),` You cannot change the responsive breakpoint in the Email Love plugin. It’s fixed at 480px, which covers virtually all mobile devices.`]})}),`\n`,_jsx(Tip,{children:_jsxs(_components.p,{children:[`This 480px width is MJML’s own column-stacking breakpoint and isn’t adjustable. The separate breakpoint that controls when your Mobile Styles tab settings (padding, font size, alignment, hide/show) switch on `,_jsx(_components.strong,{children:`is`}),` adjustable per template. See `,_jsx(_components.a,{href:`#mobile-breakpoint`,children:`Mobile Breakpoint`}),` below.`]})}),`\n`,_jsx(Heading,{level:`2`,id:`using-the-mobile-styles-tab`,children:`Using the Mobile Styles Tab`}),`\n`,_jsx(_components.p,{children:`The Mobile Styles tab is where the magic happens. Select any component in your Figma design, open the Email Love plugin, and click on Mobile Styles. Here’s what you can control:`}),`\n`,_jsx(Heading,{level:`3`,id:`mobile-padding`,children:`Mobile Padding`}),`\n`,_jsx(_components.p,{children:`Desktop padding often feels too generous on mobile. A 40px side padding on desktop leaves barely any content space on a 375px phone screen.`}),`\n`,_jsxs(_components.ol,{children:[`\n`,_jsxs(_components.li,{children:[_jsx(_components.strong,{children:`Select a component`}),` (section, column, text, image, or button)`]}),`\n`,_jsxs(_components.li,{children:[_jsx(_components.strong,{children:`Open Mobile Styles`}),` in the plugin panel`]}),`\n`,_jsxs(_components.li,{children:[_jsx(_components.strong,{children:`Adjust padding values`}),` for top, right, bottom, and left independently`]}),`\n`]}),`\n`,_jsx(Tip,{children:_jsxs(_components.p,{children:[_jsx(_components.strong,{children:`Pro tip:`}),` A good mobile padding range is 16–24px on the sides. Compare this to typical desktop padding of 32–48px.`]})}),`\n`,_jsx(Heading,{level:`3`,id:`mobile-font-sizes`,children:`Mobile Font Sizes`}),`\n`,_jsx(_components.p,{children:`What’s comfortably readable at 16px on a desktop monitor might be too small on a phone held at arm’s length. Use the Mobile Styles tab to bump font sizes for mobile:`}),`\n`,_jsxs(_components.ul,{children:[`\n`,_jsxs(_components.li,{children:[_jsx(_components.strong,{children:`Body text:`}),` 16–18px minimum on mobile (even if you use 14px on desktop)`]}),`\n`,_jsxs(_components.li,{children:[_jsx(_components.strong,{children:`Headlines:`}),` Scale down proportionally, but keep them readable. A 36px desktop headline might become 24–28px on mobile`]}),`\n`,_jsxs(_components.li,{children:[_jsx(_components.strong,{children:`Buttons:`}),` Keep button text at 16px minimum with generous padding for easy tapping`]}),`\n`]}),`\n`,_jsx(Heading,{level:`3`,id:`mobile-alignment`,children:`Mobile Alignment`}),`\n`,_jsx(_components.p,{children:`Left-aligned text on desktop sometimes works better center-aligned on mobile, especially for short headlines and CTAs. The Mobile Styles tab lets you override alignment per component.`}),`\n`,_jsx(Heading,{level:`3`,id:`hide-on-desktop-/-hide-on-mobile`,children:`Hide on Desktop / Hide on Mobile`}),`\n`,_jsx(_components.p,{children:`Show completely different content based on the viewing device. Common scenarios:`}),`\n`,_jsxs(_components.ul,{children:[`\n`,_jsx(_components.li,{children:`Swap a wide landscape hero image for a tall portrait version on mobile`}),`\n`,_jsx(_components.li,{children:`Hide secondary navigation links that clutter the mobile experience`}),`\n`,_jsx(_components.li,{children:`Show a tap-to-call button only on mobile (useless on desktop)`}),`\n`,_jsx(_components.li,{children:`Replace a detailed footer with a simplified mobile version`}),`\n`]}),`\n`,_jsxs(_components.p,{children:[`See the `,_jsx(_components.a,{href:`/plugin/mobile/show-hide-content`,children:`Show/Hide Content on Desktop \u0026 Mobile`}),` article for the full walkthrough.`]}),`\n`,_jsx(Heading,{level:`3`,id:`mobile-breakpoint`,children:`Mobile Breakpoint`}),`\n`,_jsxs(_components.p,{children:[`Every template switches from desktop to mobile styles at a breakpoint width, and it’s no longer a single fixed value for every design. Select your Main Frame, open Mobile Styles, and set a pixel value in the new `,_jsx(_components.strong,{children:`Breakpoint`}),` field, or leave it blank to use the frame’s own width. You can also save your current value as the default for every new template you create.`]}),`\n`,_jsxs(_components.p,{children:[`See `,_jsx(_components.a,{href:`/plugin/mobile/styles-tab#setting-a-custom-mobile-breakpoint`,children:`Setting a Custom Mobile Breakpoint`}),` for the full walkthrough, including how the saved default works.`]}),`\n`,_jsx(Heading,{level:`2`,id:`image-optimization-for-mobile`,children:`Image Optimization for Mobile`}),`\n`,_jsx(Heading,{level:`3`,id:`sizing`,children:`Sizing`}),`\n`,_jsx(_components.p,{children:`Images that look sharp on mobile need to be exported at 2x resolution. If your image displays at 300px wide on mobile, the source file should be 600px wide. This ensures crisp rendering on retina displays.`}),`\n`,_jsx(Heading,{level:`3`,id:`file-size`,children:`File Size`}),`\n`,_jsx(_components.p,{children:`Mobile users are often on slower connections. Large images create loading delays that kill engagement. Keep these limits in mind:`}),`\n`,_jsxs(_components.ul,{children:[`\n`,_jsxs(_components.li,{children:[_jsx(_components.strong,{children:`Hero images:`}),` Under 150KB`]}),`\n`,_jsxs(_components.li,{children:[_jsx(_components.strong,{children:`Supporting images:`}),` Under 80KB each`]}),`\n`,_jsxs(_components.li,{children:[_jsx(_components.strong,{children:`Total email weight:`}),` Under 500KB including all images`]}),`\n`,_jsxs(_components.li,{children:[_jsx(_components.strong,{children:`Format:`}),` Use compressed JPGs for photos, optimized PNGs for graphics with transparency`]}),`\n`]}),`\n`,_jsx(Heading,{level:`3`,id:`alt-text`,children:`Alt Text`}),`\n`,_jsx(_components.p,{children:`Many mobile email clients block images by default, especially in corporate environments. Alt text ensures your message still communicates even without visuals. Write alt text that describes the image’s purpose, not just its appearance.`}),`\n`,_jsx(Heading,{level:`2`,id:`mobile-design-best-practices`,children:`Mobile Design Best Practices`}),`\n`,_jsx(Heading,{level:`3`,id:`buttons-auto-sync-to-full-width`,children:`Buttons Auto-Sync to Full Width`}),`\n`,_jsxs(_components.p,{children:[`If you set a button to `,_jsx(_components.strong,{children:`Fill`}),` sizing in Figma (so it stretches to fill its column), the plugin automatically enables full-width on mobile. No need to toggle it manually. Buttons set to `,_jsx(_components.strong,{children:`Hug`}),` or `,_jsx(_components.strong,{children:`Fixed`}),` width stay at their set width on mobile. You can always override this in the Mobile Styles tab.`]}),`\n`,_jsx(Heading,{level:`3`,id:`tap-targets`,children:`Tap Targets`}),`\n`,_jsx(_components.p,{children:`Fingers are bigger than mouse cursors. Apple’s guidelines recommend minimum tap targets of 44x44px. For email buttons:`}),`\n`,_jsxs(_components.ul,{children:[`\n`,_jsx(_components.li,{children:`Minimum button height: 44px`}),`\n`,_jsx(_components.li,{children:`Generous padding around buttons: at least 16px on all sides`}),`\n`,_jsx(_components.li,{children:`Space between adjacent links: at least 8px to prevent mis-taps`}),`\n`]}),`\n`,_jsx(Heading,{level:`3`,id:`content-hierarchy`,children:`Content Hierarchy`}),`\n`,_jsx(_components.p,{children:`Mobile readers scan fast. Front-load your most important content:`}),`\n`,_jsxs(_components.ol,{children:[`\n`,_jsx(_components.li,{children:`Lead with your primary message or offer`}),`\n`,_jsx(_components.li,{children:`Follow with one clear call-to-action`}),`\n`,_jsx(_components.li,{children:`Add supporting details below the fold`}),`\n`,_jsx(_components.li,{children:`Keep secondary CTAs minimal`}),`\n`]}),`\n`,_jsx(Heading,{level:`3`,id:`column-stacking-order`,children:`Column Stacking Order`}),`\n`,_jsx(_components.p,{children:`When columns stack on mobile, they stack left-to-right by default. A three-column layout with columns A | B | C becomes A (top), B (middle), C (bottom) on mobile. Design your column order with this stacking behavior in mind.`}),`\n`,_jsxs(_components.p,{children:[`You can control stacking behavior using the `,_jsx(_components.a,{href:`/plugin/mobile/column-stacking`,children:`How to Control How Content Stacks on Mobile`}),` article.`]}),`\n`,_jsx(Heading,{level:`3`,id:`single-column-is-often-best`,children:`Single Column Is Often Best`}),`\n`,_jsx(_components.p,{children:`While the plugin supports multi-column responsive layouts, single-column emails are inherently mobile-friendly. If your content doesn’t require side-by-side comparison, consider a single-column approach that looks identical on desktop and mobile.`}),`\n`,_jsx(Heading,{level:`2`,id:`previewing-mobile-designs`,children:`Previewing Mobile Designs`}),`\n`,_jsx(_components.p,{children:`The Email Love plugin includes a mobile preview mode:`}),`\n`,_jsxs(_components.ol,{children:[`\n`,_jsx(_components.li,{children:`Click the Preview button in the plugin`}),`\n`,_jsx(_components.li,{children:`Toggle between Desktop and Mobile views`}),`\n`,_jsx(_components.li,{children:`Review your design at mobile dimensions`}),`\n`,_jsx(_components.li,{children:`Check that stacked columns read in the right order`}),`\n`,_jsx(_components.li,{children:`Verify that hidden/shown content appears correctly`}),`\n`]}),`\n`,_jsx(_components.p,{children:`For the most accurate mobile testing, export your HTML and test with Litmus, Email on Acid, or InboxMonster. These tools show real-device rendering across dozens of email clients and mobile devices.`}),`\n`,_jsx(Heading,{level:`2`,id:`common-mobile-issues`,children:`Common Mobile Issues`}),`\n`,_jsx(Heading,{level:`3`,id:`”my-email-looks-great-on-desktop-but-the-mobile-text-is-tiny”`,children:`”My email looks great on desktop but the mobile text is tiny”`}),`\n`,_jsx(_components.p,{children:`You probably haven’t set mobile-specific font sizes. Select your text components and adjust the font size in the Mobile Styles tab. Body text should be at least 16px on mobile.`}),`\n`,_jsx(Heading,{level:`3`,id:`”columns-aren’t-stacking-on-mobile”`,children:`”Columns aren’t stacking on mobile”`}),`\n`,_jsx(_components.p,{children:`Make sure your columns are inside a properly structured MJML section. Verify the MJML structure is correct. Also check that you haven’t set columns to “force desktop” layout.`}),`\n`,_jsx(Heading,{level:`3`,id:`”my-images-are-overflowing-on-small-screens”`,children:`”My images are overflowing on small screens”`}),`\n`,_jsx(_components.p,{children:`Image widths in email are set in pixels, not percentages. If your image is 640px wide but the mobile screen is 375px, the image should scale down automatically with MJML. If it’s not scaling, check that the image is inside a properly structured mj-column.`}),`\n`,_jsx(Heading,{level:`3`,id:`”the-padding-looks-massive-on-mobile”`,children:`”The padding looks massive on mobile”`}),`\n`,_jsx(_components.p,{children:`Desktop padding doesn’t automatically adjust for mobile. Set separate mobile padding values in the Mobile Styles tab. A 48px desktop side-padding should drop to 16–20px on mobile.`}),`\n`,_jsx(_components.p,{children:_jsxs(_components.em,{children:[`Need help optimizing for mobile? Reach out at `,_jsx(_components.a,{href:`mailto:support@emaillove.com`,children:`support@emaillove.com`}),` or join our Slack.`]})})]})}function MDXContent(props={}){const{wrapper:MDXLayout}={..._provideComponents(),...props.components};return MDXLayout?_jsx(MDXLayout,{...props,children:_jsx(_createMdxContent,{...props})}):_createMdxContent(props)}return{default:MDXContent};function _missingMdxReference(id,component){throw new Error(`Expected `+(component?`component`:`object`)+\" `\"+id+\"` to be defined: you likely forgot to import, pass, or provide it.\")}","frontmatter":{},"scope":{"config":{},"pageMetadata":{"title":"Mobile Optimization","description":"Optimize your email designs for mobile with per-device styles, stacking, and show/hide controls.","href":"/plugin/mobile/overview"}}},"mdxSourceWithNoJs":null},"mdxExtracts":{"tableOfContents":[{"title":"How Mobile Rendering Works","slug":"how-mobile-rendering-works","depth":2,"children":[]},{"title":"Using the Mobile Styles Tab","slug":"using-the-mobile-styles-tab","depth":2,"children":[{"title":"Mobile Padding","slug":"mobile-padding","depth":3,"children":[]},{"title":"Mobile Font Sizes","slug":"mobile-font-sizes","depth":3,"children":[]},{"title":"Mobile Alignment","slug":"mobile-alignment","depth":3,"children":[]},{"title":"Hide on Desktop / Hide on Mobile","slug":"hide-on-desktop-/-hide-on-mobile","depth":3,"children":[]},{"title":"Mobile Breakpoint","slug":"mobile-breakpoint","depth":3,"children":[]}]},{"title":"Image Optimization for Mobile","slug":"image-optimization-for-mobile","depth":2,"children":[{"title":"Sizing","slug":"sizing","depth":3,"children":[]},{"title":"File Size","slug":"file-size","depth":3,"children":[]},{"title":"Alt Text","slug":"alt-text","depth":3,"children":[]}]},{"title":"Mobile Design Best Practices","slug":"mobile-design-best-practices","depth":2,"children":[{"title":"Buttons Auto-Sync to Full Width","slug":"buttons-auto-sync-to-full-width","depth":3,"children":[]},{"title":"Tap Targets","slug":"tap-targets","depth":3,"children":[]},{"title":"Content Hierarchy","slug":"content-hierarchy","depth":3,"children":[]},{"title":"Column Stacking Order","slug":"column-stacking-order","depth":3,"children":[]},{"title":"Single Column Is Often Best","slug":"single-column-is-often-best","depth":3,"children":[]}]},{"title":"Previewing Mobile Designs","slug":"previewing-mobile-designs","depth":2,"children":[]},{"title":"Common Mobile Issues","slug":"common-mobile-issues","depth":2,"children":[{"title":"”My email looks great on desktop but the mobile text is tiny”","slug":"”my-email-looks-great-on-desktop-but-the-mobile-text-is-tiny”","depth":3,"children":[]},{"title":"”Columns aren’t stacking on mobile”","slug":"”columns-aren’t-stacking-on-mobile”","depth":3,"children":[]},{"title":"”My images are overflowing on small screens”","slug":"”my-images-are-overflowing-on-small-screens”","depth":3,"children":[]},{"title":"”The padding looks massive on mobile”","slug":"”the-padding-looks-massive-on-mobile”","depth":3,"children":[]}]}],"codeExamples":{}},"jsLinks":[],"subdomain":"emaillove","siteName":"Email Love","title":"Mobile Optimization - Email Love","navMaps":{"firstHrefInVersion":{},"firstHrefInLanguage":{}},"lastModified":"2026-10-23T00:47:57.498Z","originalFileLocation":"plugin/mobile/overview.mdx"},"headHtml":"\u003cscript data-mint-head>(function(){var d=document.documentElement,p=null;if(!p){try{p=localStorage.getItem(\"isDarkMode\")}catch(e){}if(p==='true')p='dark';else if(p==='false')p='light';if(p!=='light'\u0026\u0026p!=='dark'\u0026\u0026p!=='system')p=\"system\"}var r=p==='system'?(matchMedia(\"(prefers-color-scheme: dark)\").matches?'dark':'light'):p;d.classList.remove(r==='dark'?'light':'dark');d.classList.add(r);d.setAttribute(\"data-theme-preference\",p)})();\u003c/script>\u003cmeta data-mint-head name=\"description\" content=\"Optimize your email designs for mobile with per-device styles, stacking, and show/hide controls.\">\u003cmeta data-mint-head name=\"application-name\" content=\"Email Love\">\u003cmeta data-mint-head name=\"generator\" content=\"Mintlify\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"192x192\" href=\"/mintlify-assets/_mintlify/favicons/emaillove/za0bzVyFLeMJKeQW/_generated/favicon/android-chrome-192x192.png\" media=\"(prefers-color-scheme: light)\">\u003clink data-mint-head rel=\"apple-touch-icon\" type=\"image/png\" sizes=\"180x180\" href=\"/mintlify-assets/_mintlify/favicons/emaillove/za0bzVyFLeMJKeQW/_generated/favicon/apple-touch-icon.png\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"16x16\" href=\"/mintlify-assets/_mintlify/favicons/emaillove/za0bzVyFLeMJKeQW/_generated/favicon/favicon-16x16.png\" media=\"(prefers-color-scheme: light)\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"32x32\" href=\"/mintlify-assets/_mintlify/favicons/emaillove/za0bzVyFLeMJKeQW/_generated/favicon/favicon-32x32.png\" media=\"(prefers-color-scheme: light)\">\u003clink data-mint-head rel=\"shortcut icon\" type=\"image/x-icon\" href=\"/mintlify-assets/_mintlify/favicons/emaillove/za0bzVyFLeMJKeQW/_generated/favicon/favicon.ico\" media=\"(prefers-color-scheme: light)\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"192x192\" href=\"/mintlify-assets/_mintlify/favicons/emaillove/za0bzVyFLeMJKeQW/_generated/favicon-dark/android-chrome-192x192.png\" media=\"(prefers-color-scheme: dark)\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"16x16\" href=\"/mintlify-assets/_mintlify/favicons/emaillove/za0bzVyFLeMJKeQW/_generated/favicon-dark/favicon-16x16.png\" media=\"(prefers-color-scheme: dark)\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"32x32\" href=\"/mintlify-assets/_mintlify/favicons/emaillove/za0bzVyFLeMJKeQW/_generated/favicon-dark/favicon-32x32.png\" media=\"(prefers-color-scheme: dark)\">\u003clink data-mint-head rel=\"shortcut icon\" type=\"image/x-icon\" href=\"/mintlify-assets/_mintlify/favicons/emaillove/za0bzVyFLeMJKeQW/_generated/favicon-dark/favicon.ico\" media=\"(prefers-color-scheme: dark)\">\u003cmeta data-mint-head property=\"og:title\" content=\"Mobile Optimization - Email Love\">\u003cmeta data-mint-head property=\"og:description\" content=\"Optimize your email designs for mobile with per-device styles, stacking, and show/hide controls.\">\u003cmeta data-mint-head property=\"og:site_name\" content=\"Email Love\">\u003cmeta data-mint-head property=\"og:url\" content=\"https://help.emaillove.com/plugin/mobile/overview\">\u003cmeta data-mint-head property=\"og:type\" content=\"website\">\u003cmeta data-mint-head property=\"og:image\" content=\"https://emaillove.mintlify.site/_mintlify/api/og/v2?division=Mobile+%26+Dark+Mode\u0026amp;title=Mobile+Optimization\u0026amp;description=Optimize+your+email+designs+for+mobile+with+per-device+styles%2C+stacking%2C+and+show%2Fhide+controls.\u0026amp;theme=37360a928446334d3b7f6a44\u0026amp;signature=e66fd6a9e8ab5e847a47fcfdb7c36694ad87a14ee5c5093432be077bfcbd15a5\">\u003cmeta data-mint-head property=\"og:image:width\" content=\"1200\">\u003cmeta data-mint-head property=\"og:image:height\" content=\"630\">\u003cmeta data-mint-head name=\"twitter:card\" content=\"summary_large_image\">\u003cmeta data-mint-head name=\"twitter:title\" content=\"Mobile Optimization - Email Love\">\u003cmeta data-mint-head name=\"twitter:description\" content=\"Optimize your email designs for mobile with per-device styles, stacking, and show/hide controls.\">\u003cmeta data-mint-head name=\"twitter:image\" content=\"https://emaillove.mintlify.site/_mintlify/api/og/v2?division=Mobile+%26+Dark+Mode\u0026amp;title=Mobile+Optimization\u0026amp;description=Optimize+your+email+designs+for+mobile+with+per-device+styles%2C+stacking%2C+and+show%2Fhide+controls.\u0026amp;theme=37360a928446334d3b7f6a44\u0026amp;signature=e66fd6a9e8ab5e847a47fcfdb7c36694ad87a14ee5c5093432be077bfcbd15a5\">\u003cmeta data-mint-head name=\"twitter:image:width\" content=\"1200\">\u003cmeta data-mint-head name=\"twitter:image:height\" content=\"630\">\u003cmeta data-mint-head name=\"msapplication-config\" content=\"/mintlify-assets/_mintlify/favicons/emaillove/za0bzVyFLeMJKeQW/_generated/favicon/browserconfig.xml\">\u003cmeta data-mint-head name=\"apple-mobile-web-app-title\" content=\"Email Love\">\u003cmeta data-mint-head name=\"msapplication-TileColor\" content=\"#E81A3F\">\u003clink data-mint-head rel=\"canonical\" href=\"https://help.emaillove.com/plugin/mobile/overview\">\u003clink data-mint-head rel=\"alternate\" type=\"application/xml\" href=\"/sitemap.xml\">\u003clink data-mint-head rel=\"alternate\" type=\"text/markdown\" href=\"/plugin/mobile/overview.md\">\u003cscript data-mint-head type=\"application/ld+json\">{\"@context\":\"https://schema.org\",\"@graph\":[{\"@type\":\"Organization\",\"@id\":\"https://help.emaillove.com/#organization\",\"name\":\"Email Love\",\"url\":\"https://help.emaillove.com\",\"logo\":{\"@type\":\"ImageObject\",\"url\":\"https://mintcdn.com/emaillove/zdvKWcm2hTqSKqVZ/logo/light.png?fit=max\u0026auto=format\u0026n=zdvKWcm2hTqSKqVZ\u0026q=85\u0026s=1d0cc0df4e2036624a1a61cb4e0a6938\"}},{\"@type\":\"WebSite\",\"@id\":\"https://help.emaillove.com#website\",\"name\":\"Email Love\",\"url\":\"https://help.emaillove.com\",\"publisher\":{\"@id\":\"https://help.emaillove.com/#organization\"}},{\"@type\":\"WebPage\",\"@id\":\"https://help.emaillove.com/plugin/mobile/overview#webpage\",\"url\":\"https://help.emaillove.com/plugin/mobile/overview\",\"name\":\"Mobile Optimization\",\"description\":\"Optimize your email designs for mobile with per-device styles, stacking, and show/hide controls.\",\"dateModified\":\"2026-10-23T00:47:57.498Z\",\"isPartOf\":{\"@id\":\"https://help.emaillove.com#website\"},\"breadcrumb\":{\"@id\":\"https://help.emaillove.com/plugin/mobile/overview#breadcrumb\"}},{\"@type\":\"BreadcrumbList\",\"@id\":\"https://help.emaillove.com/plugin/mobile/overview#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Documentation\",\"item\":\"https://help.emaillove.com/plugin/getting-started/overview\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Mobile Optimization\",\"item\":\"https://help.emaillove.com/plugin/mobile/overview\"}]},{\"@type\":[\"Article\",\"TechArticle\"],\"@id\":\"https://help.emaillove.com/plugin/mobile/overview#article\",\"headline\":\"Mobile Optimization\",\"name\":\"Mobile Optimization\",\"description\":\"Optimize your email designs for mobile with per-device styles, stacking, and show/hide controls.\",\"url\":\"https://help.emaillove.com/plugin/mobile/overview\",\"mainEntityOfPage\":{\"@id\":\"https://help.emaillove.com/plugin/mobile/overview#webpage\"},\"dateModified\":\"2026-10-23T00:47:57.498Z\",\"publisher\":{\"@id\":\"https://help.emaillove.com/#organization\"},\"isPartOf\":{\"@id\":\"https://help.emaillove.com#website\"}}]}\u003c/script>\u003cscript data-mint-head type=\"application/ld+json\">{\"@context\":\"https://schema.org\",\"@type\":\"WebSite\",\"name\":\"Email Love\",\"creator\":{\"@type\":\"Organization\",\"name\":\"Mintlify\",\"url\":\"https://mintlify.com\"}}\u003c/script>","siteName":"Email Love","nav":{"global":{"anchors":[{"anchor":"Community","icon":"slack","href":"https://emaillove.com/go/slack"}]},"tabs":[{"tab":"Figma Plugin","icon":"figma","groups":[{"group":"Documentation","pages":[{"title":"Getting Started with the Email Love Figma Plugin","sidebarTitle":"Getting Started","href":"/plugin/getting-started/overview"},{"title":"Migrating an Existing Design System or Template","sidebarTitle":"Migrate a Design System or Template","href":"/plugin/getting-started/migrate-design-system"},{"group":"Start Here","icon":"rocket","pages":[{"title":"Installing the Email Love Figma Plugin","href":"/plugin/getting-started/install"},{"title":"Build Your First Email from a Template","href":"/plugin/quickstart/from-template"},{"title":"Build an Email from Scratch","href":"/plugin/quickstart/from-scratch"},{"title":"Convert or Rebuild an Existing Email Design","href":"/plugin/quickstart/existing-design"}]},{"group":"How It Works","icon":"graduation-cap","pages":[{"title":"Email Fundamentals","href":"/plugin/getting-started/email-fundamentals"},{"title":"Understanding Email Love Frames, Layers, and Components","href":"/plugin/getting-started/frames-layers-components"},{"title":"Element Reference: Section, Column \u0026 Wrapper","sidebarTitle":"Section, Column \u0026 Wrapper","href":"/plugin/getting-started/section-column-wrapper"},{"title":"Understanding MJML","href":"/plugin/getting-started/mjml"},{"title":"Email Client Compatibility Matrix","href":"/plugin/getting-started/client-compatibility"},{"title":"Email Accessibility Guide","href":"/plugin/getting-started/accessibility"},{"title":"Keyboard Shortcuts \u0026 Workflow Tips","href":"/plugin/getting-started/shortcuts"}]},{"group":"Building with Components","icon":"cubes","pages":[{"title":"Pre-Built Components","href":"/plugin/components/pre-built"},{"title":"Add wrappers, sections, and content","href":"/plugin/components/build-structure"},{"title":"Create a scalable set of Button components for your Email Design System","href":"/plugin/components/button-system"},{"title":"Understanding Figma Components, Variants, and Properties","href":"/plugin/components/variants-properties"},{"title":"The Customs tab \u0026 Community templates","href":"/plugin/components/customs-tab"},{"title":"Saving Customized Components \u0026 Templates Inside of the Plugin","href":"/plugin/components/save-components"},{"title":"Save your customized components and templates","href":"/plugin/components/save-custom-components"},{"title":"Creating and Managing Design Systems","href":"/plugin/components/design-systems"},{"title":"Set Up a Design System Admin and Share Components With Your Team","href":"/plugin/components/share-design-system-with-team"},{"title":"Personalize your email content with dynamic content","href":"/plugin/components/dynamic-content"},{"title":"Optimizing Component File Size to Avoid Getting Clipped in Gmail","href":"/plugin/components/gmail-clipping"},{"title":"Using the Raw Code Component","href":"/plugin/raw-code/overview"},{"title":"The Properties Tab","href":"/plugin/email-properties/properties-tab"}]},{"group":"Styling","icon":"palette","pages":[{"title":"The Appearance Tab","href":"/plugin/styling/appearance-tab"},{"title":"Element Reference: Text","sidebarTitle":"Text","href":"/plugin/styling/text"},{"title":"Typography","href":"/plugin/styling/typography"},{"title":"Element Reference: Button","sidebarTitle":"Buttons","href":"/plugin/styling/button"},{"title":"Padding","href":"/plugin/styling/padding"},{"title":"Align Frames and Content","href":"/plugin/styling/alignment"},{"title":"Element Reference: Spacer \u0026 Divider","sidebarTitle":"Spacer \u0026 Divider","href":"/plugin/styling/spacer-divider"},{"title":"Corner Radius","href":"/plugin/styling/corner-radius"},{"title":"Background Colors","href":"/plugin/styling/background-colors"},{"title":"Background Images in Email","href":"/plugin/styling/background-images"},{"title":"Create a Full-Width Background","href":"/plugin/styling/full-width-background"},{"title":"Hero Sections","href":"/plugin/styling/hero-sections"},{"title":"Set default custom code for every new template (Persistent Custom Code)","href":"/plugin/styling/persistent-custom-code"}]},{"group":"Images \u0026 Media","icon":"image","pages":[{"title":"Add and Replace Images","href":"/plugin/images/add-images"},{"title":"Using Animated GIFs in Email","href":"/plugin/images/animated-gifs"},{"title":"Embed a Countdown Timer into your email","href":"/plugin/images/countdown-timer"},{"title":"Editable Images","href":"/plugin/images/editable-images"},{"title":"Use an External Image URL","href":"/plugin/images/external-images"},{"title":"Optimize Images for Mobile","href":"/plugin/images/mobile-images"},{"title":"Add Links and Alt Text to Images","href":"/plugin/images/links-alt-text"},{"title":"Image Hosting","href":"/plugin/images/hosting"}]},{"group":"Links","icon":"link","pages":[{"title":"Adding Links to an Email","href":"/plugin/links/add-links"},{"title":"Navigation links","href":"/plugin/links/navigation"},{"title":"Unsubscribe Links","href":"/plugin/links/unsubscribe"},{"title":"Add UTM Parameters","description":"Append campaign tracking parameters to the ordinary links in an email without changing each URL by hand","href":"/plugin/links/utm-parameters"}]},{"group":"Mobile \u0026 Dark Mode","icon":"mobile-screen","pages":[{"title":"Mobile Optimization","href":"/plugin/mobile/overview"},{"title":"The Mobile Styles Tab","description":"How to customize text, images, buttons, and wrappers for mobile devices using the Mobile Styles tab","href":"/plugin/mobile/styles-tab"},{"title":"How to control how content stacks on mobile","href":"/plugin/mobile/column-stacking"},{"title":"Show/Hide Content on Desktop \u0026 Mobile","href":"/plugin/mobile/show-hide-content"},{"title":"Optimize Your Email for Dark Mode","href":"/plugin/styling/dark-mode"},{"title":"Why Outlook Dark Mode Is Different (And What to Do About It)","href":"/plugin/styling/outlook-dark-mode"}]},{"group":"Preview \u0026 Test","icon":"eye","pages":[{"title":"Previewing an Email Design","href":"/plugin/preview/overview"},{"title":"Download Email Screenshots","href":"/plugin/preview/screenshots"}]},{"group":"AI Studio","icon":"wand-magic-sparkles","pages":[{"title":"Generate Emails with AI Studio","href":"/plugin/ai/generate"},{"title":"Import Existing Designs with AI Import","href":"/plugin/ai/ai-import"},{"title":"Build Emails in Figma with Claude or Codex","href":"/plugin/ai/agents-in-figma"},{"title":"Advanced Figma MCP Guide","href":"/plugin/ai/agents-in-figma-advanced"},{"title":"Send with confidence using Copilot","href":"/plugin/ai/copilot"},{"title":"How to Get the Best Results from Generate from Brief","href":"/plugin/ai/brief-best-practices"},{"title":"Sample Campaign Brief","href":"/plugin/ai/sample-brief"},{"title":"Email Love MCP","href":"/plugin/ai/email-inspiration-mcp"}]},{"group":"Exporting","icon":"file-export","pages":[{"title":"Export Overview","href":"/plugin/export/overview"},{"title":"Export Your First Email","href":"/plugin/export/basics"},{"title":"Export HTML Content Blocks (ZIP)","href":"/plugin/export/html-content-blocks"},{"title":"Updatable Templates: update in place instead of creating duplicates","href":"/plugin/export/updatable-templates"}]},{"group":"ESP Integrations","icon":"plug","pages":[{"title":"Export Figma emails to ActiveCampaign","sidebarTitle":"ActiveCampaign","href":"/plugin/export/activecampaign"},{"title":"Export Figma emails to Airship","sidebarTitle":"Airship","href":"/plugin/export/airship"},{"title":"Export Figma emails to Blueshift","sidebarTitle":"Blueshift","href":"/plugin/export/blueshift"},{"title":"Export Figma emails to Braze","sidebarTitle":"Braze","href":"/plugin/export/braze"},{"title":"Export Figma emails to Brevo","sidebarTitle":"Brevo","href":"/plugin/export/brevo"},{"title":"Sync Figma emails to Email Love Builder","sidebarTitle":"Email Love Builder","href":"/plugin/export/builder"},{"title":"Export Figma emails to a Custom Webhook","sidebarTitle":"Custom Webhook","href":"/plugin/export/custom-webhook"},{"title":"Export Figma emails to Customer.io","sidebarTitle":"Customer.io","href":"/plugin/export/customerio"},{"title":"Export Figma emails to Dotdigital","sidebarTitle":"Dotdigital","href":"/plugin/export/dotdigital"},{"title":"Export Figma emails to Emarsys","sidebarTitle":"Emarsys","href":"/plugin/export/emarsys"},{"title":"Export Figma emails to HubSpot","sidebarTitle":"HubSpot","href":"/plugin/export/hubspot"},{"title":"Export Figma emails to Iterable","sidebarTitle":"Iterable","href":"/plugin/export/iterable"},{"title":"Export Figma emails to Klaviyo","sidebarTitle":"Klaviyo","href":"/plugin/export/klaviyo"},{"title":"Export Figma emails to Loops","sidebarTitle":"Loops","href":"/plugin/export/loops"},{"title":"Export Figma emails to Mailchimp","sidebarTitle":"Mailchimp","href":"/plugin/export/mailchimp"},{"title":"Export Figma emails to MailerLite","sidebarTitle":"MailerLite","href":"/plugin/export/mailerlite"},{"title":"Export Figma emails to Mailjet","sidebarTitle":"Mailjet","href":"/plugin/export/mailjet"},{"title":"Export Figma emails to Make","sidebarTitle":"Make","href":"/plugin/export/make"},{"title":"Export Figma emails to Marketo","sidebarTitle":"Marketo","href":"/plugin/export/marketo"},{"title":"Export Figma emails to MoEngage","sidebarTitle":"MoEngage","href":"/plugin/export/moengage"},{"title":"Export Figma emails to Netcore","sidebarTitle":"Netcore","href":"/plugin/export/netcore"},{"title":"Export Figma emails to OneSignal","sidebarTitle":"OneSignal","href":"/plugin/export/onesignal"},{"title":"Export Figma emails to Parcel","sidebarTitle":"Parcel","href":"/plugin/export/parcel"},{"title":"Export Figma emails to Pardot (Account Engagement)","sidebarTitle":"Pardot","href":"/plugin/export/pardot"},{"title":"Export Figma emails to Postmark","sidebarTitle":"Postmark","href":"/plugin/export/postmark"},{"title":"Export Figma emails to Sailthru","sidebarTitle":"Sailthru","href":"/plugin/export/sailthru"},{"title":"Export Figma emails to Salesforce Marketing Cloud","sidebarTitle":"Salesforce Marketing Cloud","href":"/plugin/export/salesforce-marketing-cloud"},{"title":"Export Figma emails to SendGrid","sidebarTitle":"SendGrid","href":"/plugin/export/sendgrid"},{"title":"Export Figma emails to SendX","sidebarTitle":"SendX","href":"/plugin/export/sendx"},{"title":"Export Figma emails to Shopify","sidebarTitle":"Shopify","href":"/plugin/export/shopify"},{"title":"Export Figma emails to Stripo","sidebarTitle":"Stripo","href":"/plugin/export/stripo"},{"title":"Export Figma emails to Zapier","sidebarTitle":"Zapier","href":"/plugin/export/zapier"}]},{"group":"Translation","icon":"language","pages":[{"title":"Localization \u0026 Translation Overview","href":"/plugin/export/translation/overview"},{"title":"How to Translate Braze Email Templates Using Smartling","href":"/plugin/export/translation/braze-smartling"},{"title":"How to Translate Iterable Email Templates Using Lokalise","href":"/plugin/export/translation/iterable-lokalise"}]},{"group":"Video Tutorials","icon":"circle-play","pages":[{"title":"Demo Videos","href":"/plugin/videos/demos"},{"title":"Build Along Tutorials","href":"/plugin/videos/build-along"}]},{"group":"Account \u0026 Billing","icon":"credit-card","pages":[{"title":"Email Love Subscription Plans","href":"/plugin/account/plans"},{"title":"Managing Your Subscription","href":"/plugin/account/manage-subscription"},{"title":"Canceling Your Subscription","href":"/plugin/account/cancel"}]},{"group":"Help","icon":"circle-question","pages":[{"title":"Troubleshooting \u0026 FAQ","href":"/plugin/getting-started/troubleshooting"},{"title":"Get Help from Claude or Codex","href":"/plugin/ai/agent-help"},{"title":"Security","href":"/plugin/security/overview"},{"title":"What's New / Changelog","href":"/plugin/getting-started/changelog"}]}]}]},{"tab":"Builder","icon":"browser","pages":[{"title":"Builder","href":"/builder/getting-started/overview"}]}]},"basePath":"","title":"Mobile Optimization - Email Love","buildId":"dpl_42LwxxU1kGN114H4XzwGYXa9ZDah","deploymentId":"dpl_42LwxxU1kGN114H4XzwGYXa9ZDah","dynamics":[],"chunks":[]}
