Generate Cross-Client HTML Emails With MJML1 skill
Create responsive, production-ready email templates using MJML that render identically across Outlook, Gmail, Apple Mail, and mobile clients.
Content Blueprint
Generate Production-Ready HTML Emails With MJML
framix-teamMay 2026
Create responsive email templates that render perfectly across Outlook, Gmail, Apple Mail, and mobile clients—no table coding required.
Email Template GenerationCross-Client RenderingMJML Compilation
Install Command
Run this command to deploy the blueprint to your environment.
What does this do
Email rendering is broken by design. Every client (Outlook Word engine, Gmail, iOS Mail, Android) uses different rendering rules. Writing cross-client email HTML by hand requires deep knowledge of VML injection, Ghost Tables, CSS inlining, and client-specific quirks that break in production.
How It Works
Describe your email to Claude Code. The skill generates complete, valid MJML source and compiles it to production-ready minified HTML. MJML abstracts away client-specific complexity—Ghost Tables for Outlook, VML background images, hybrid-fluid column math, Gmail CSS inlining—all from semantic XML. You get both the editable MJML source and the compiled HTML ready to send via your ESP.
Included Skill Groups
Key Features
Cross-Client Rendering
Automatically generates Ghost Tables, VML backgrounds, and hybrid-fluid layouts so emails render identically in Outlook, Gmail, Apple Mail, iOS Mail, and Android.
Gmail Clip Prevention
Automatic minification removes whitespace between columns, keeping compiled HTML under 102KB and eliminating the iOS/Android column stacking bug.
Accessibility Built-In
Every template includes WCAG 2.1 AA compliance: mandatory alt text on images, proper heading roles via mj-html-attributes, dark mode support, and 4.5:1 contrast validation.
Zero-Configuration Outlook Compatibility
Automatic VML injection for section/hero backgrounds, font fallback protection via mj-font, and keyword-only background positioning—no special Outlook handling needed.
Template Engine Support
Protects Handlebars, Liquid, and Jinja template tags in mj-raw blocks so your ESP can inject dynamic content without parser conflicts.
Key Features
Cross-Client Rendering
Automatically generates Ghost Tables, VML backgrounds, and hybrid-fluid layouts so emails render identically in Outlook, Gmail, Apple Mail, iOS Mail, and Android.
Gmail Clip Prevention
Automatic minification removes whitespace between columns, keeping compiled HTML under 102KB and eliminating the iOS/Android column stacking bug.
Accessibility Built-In
Every template includes WCAG 2.1 AA compliance: mandatory alt text on images, proper heading roles via mj-html-attributes, dark mode support, and 4.5:1 contrast validation.
Zero-Configuration Outlook Compatibility
Automatic VML injection for section/hero backgrounds, font fallback protection via mj-font, and keyword-only background positioning—no special Outlook handling needed.
Template Engine Support
Protects Handlebars, Liquid, and Jinja template tags in mj-raw blocks so your ESP can inject dynamic content without parser conflicts.
Tools in this Blueprint
About This Blueprint
- License
- MIT
- Industry
- Technology
- Skills
- 0 workflows, 0 sub-skills, 1 standalone