文档办公

email-html-mjml

framix-team/ski…tml-mjml

Responsive HTML email template generation using MJML 5.x framework. Use when the user asks to create, generate, design, or build an email template — including welcome emails, promotional blasts, transactional templates, newsletters, or any responsive email. Also use when the user asks to compile MJML to HTML, work with or edit existing MJML templates or `.mjml` files, or troubleshoot email rendering issues across clients.

  • 959 次安装
  • 81 星标
  • 收录于

安装命令

npx skills add https://github.com/framix-team/skill-email-html-mjml --skill email-html-mjml

SKILL.md

email-html-mjml — Responsive Email Developer

Generate valid, cross-client MJML 5.x templates and compile them to production-ready HTML. The primary goal is compatibility: Outlook (2013–365), Gmail (web/app), Apple Mail, and major mobile clients. Every output must be compilable with --config.validationLevel=strict and survive Gmail's 102KB clip limit.


Workflow

  1. Gather requirements — Infer email type, brand colors, and content from the user's message and conversation context. Ask only for what is genuinely missing and blocking progress (e.g., no colors provided and the layout has branded sections). Never front-load a questionnaire.
  2. Plan layout — Decide and announce the structure before writing code (single-column, 2-col grid, hero + content, etc.)
  3. Load component references — Read the relevant file(s) from the Component Index below before writing any MJML
  4. Generate MJML — Write complete, valid MJML starting from <mjml> with a full <mj-head>
  5. Compile — Follow compilation.md. Run npx mjml with --config.minify=true
  6. Deliver both files — Always output .mjml source AND compiled .html

9 Engineering Rules