Email HTML Mjml — Communication skill for Claude Code

email-html-mjml — Production-Ready Email Templates for Claude Code

**A Claude Code skill that generates responsive, cross-client HTML email from a single conversation.**

Describe your email. Get back valid MJML source and compiled, production-ready HTML — guaranteed to render in Outlook 2013–365, Gmail (web and app), and Apple Mail without manual table coding, VML hand-authoring, or email client guesswork.

---

The Problem: Email Rendering Is Broken by Design

Every major email client uses a different rendering engine:

• Outlook 2007–2021 renders HTML with Microsoft Word — not a browser
• Gmail strips CSS and clips messages over 102KB
• iOS Mail and Android stack multi-column layouts when whitespace exists between inline-block elements
• Apple Mail applies forced dark-mode inversion on light backgrounds

The result: an email that looks correct in a browser can break catastrophically in production. Fixing it requires deep knowledge of **VML injection**, **Ghost Tables**, **CSS inlining**, and client-specific quirks that are rarely documented in one place.

---

The Solution: MJML as a Reliability Framework

This skill uses **MJML 4.x** — not as a convenience layer, but as a **structural reliability framework**. MJML compiles semantic XML into the deeply nested, client-specific table HTML that email clients actually need. The output includes:

• Ghost Tables (MSO conditional comments) that constrain layout for Outlook's Word engine while remaining invisible to modern clients
• Automatic VML injection for background images in and , the only two components where Outlook supports them
• Hybrid-Fluid column math — fluid percentage widths for modern clients, fixed Ghost Table widths for Outlook — generated from the same source

Writing this HTML by hand is error-prone and nearly impossible to maintain. MJML makes the correct output the default output.

---

What This Skill Delivers

...