mcpField
E
email-html-mjml

email-html-mjml

github.com/podoDesign & UI29223 installsUpdated 4d ago
Repository

About email-html-mjml

email-html-mjml is a skill for generating and troubleshooting HTML email with MJML 5.x. It is intended for developers who need responsive, validated email output, with both MJML source and compiled HTML.

Key features

  1. 01MJML-based responsive email generation
  2. 02Compile to table-based HTML
  3. 03Strict-mode validation
  4. 04Gmail clipping-limit check
  5. 05Accessible markup guidance

Use cases

  1. 01Create newsletter or order-confirmation emails
  2. 02Compile MJML into HTML email
  3. 03Troubleshoot existing HTML email

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/podo/design-agent-skills --skill email-html-mjml

After installing, type/email-html-mjmlin Claude Code to confirm it loaded.

Bundled filesstub.yaml

Details

From the project README

email-html-mjml

Catalogue stub — full skill: framix-team/skill-email-html-mjml

Decision tree

  1. Is the full skill already installed?

    • Global: f=~/.agents/skills/email-html-mjml/SKILL.md; [ -f "$f" ] && ! grep -q "^das:" "$f" && echo "installed" || echo "pointer"
    • Project: f=.agents/skills/email-html-mjml/SKILL.md; [ -f "$f" ] && ! grep -q "^das:" "$f" && echo "installed" || echo "pointer"
    • installed → the skill is installed as email-html-mjml, invoke it and proceed
    • pointer → go to step 2

  2. Detect scope, then install:

    [ -e ~/.agents/skills/email-html-mjml ] && echo "global" || echo "project"

    Global:

    npx skills add framix-team/skill-email-html-mjml --skill email-html-mjml -g -y

    Project:

    npx skills add framix-team/skill-email-html-mjml --skill email-html-mjml -y

    Claude Code: send a command as a chat message starting with ! to run it without leaving the conversation.

Heads-up

  • Requires: Node.js 20 or later; MJML installed per project (npm install -D mjml), never globally
  • License: MIT

Invoke after install

  • Skill name: email-html-mjml
  • Trigger phrases: "MJML", "HTML email", "email template", "Outlook-safe email"

What it does

Generates production-ready HTML email using MJML 5.x as the authoring layer. MJML's responsive components compile to table-based HTML that is compatible with Outlook 2013 through 365, Gmail web and mobile, Apple Mail, and other major clients. The skill ships component references, example templates (newsletter, order confirmation, promo, basic layout) and compile instructions; it always delivers the .mjml source and the compiled .html, validated with MJML's strict mode and checked against Gmail's 102 KB clipping limit. Output follows accessibility rules (alt text, titles, contrast). The skill self-activates when asked to create, compile, or troubleshoot any HTML email.

It compiles with npx mjml, so Node.js 20 or later is required, and MJML itself is installed per project (npm install -D mjml).

When NOT to use

  • Marketing web page HTML — use design-html instead
  • Animated web content or interactive landing pages
  • Email rendering testing across clients (use a dedicated email testing service like Litmus)

Comments

Markdown supported