| name | email-render-builder |
| slug | aaron-email-render-builder |
| displayName | Email Render Builder · 邮件HTML |
| summary | 邮件HTML/响应式邮件/暗色模式渲染 |
| description | Use when the user asks to "build the email HTML", "make this email responsive", "fix dark-mode rendering", or "QA the email across clients"; produces the coded HTML build — a responsive table layout, dark-mode + accessibility pass, a client-render matrix, image-block fallbacks, and a plain-text parity check. Not for writing the copy — use email-creative-builder; not for scoring the email or computing EQS — use email-quality-auditor. 邮件HTML/响应式邮件/暗色模式渲染 |
| version | 19.0.0 |
| license | Apache-2.0 |
| compatibility | Claude Code and compatible agent-skill hosts |
| homepage | https://github.com/aaron-he-zhu/aaron-marketing-skills |
| when_to_use | Use when coding or QA-ing the HTML build of an email that copy is already written for: converting approved creative into a responsive table-based layout, checking dark-mode color inversion, running an accessibility pass (alt text, semantic order, contrast, font-size), producing a client-render matrix (Gmail/Outlook/Apple Mail/mobile), specifying image-off fallbacks and bulletproof buttons, and verifying the plain-text alternate matches the HTML. Covers B2C promo, B2B, and newsletter builds. Not for authoring the words, and not for the EQS gate. |
| argument-hint | <email creative or HTML> [target clients] [mode: promo|cold|newsletter] |
| metadata | {"author":"aaron-he-zhu","version":"19.0.0","discipline":"email","phase":"engage","geo-relevance":"low","hermes":{"tags":["marketing","email","engage"],"category":"email"},"openclaw":{"emoji":"✉️","homepage":"https://github.com/aaron-he-zhu/aaron-marketing-skills"}} |
Email Render Builder
Builds and QAs the coded HTML for a single email — a responsive table-based layout, a dark-mode + accessibility pass, a client-render matrix, image-block fallbacks with bulletproof CTAs, and a plain-text-parity check. This is the render half of SEND Engage: email-creative-builder writes the words, this skill turns them into a build that lands the same in Gmail, Outlook, Apple Mail, and on mobile. It does not write copy, and it does not score the email or run any veto — that is email-quality-auditor.
Scope guard: this skill produces the HTML build + render QA + plain-text parity only. It writes no subject-line or body copy (email-creative-builder owns that), scores no SEND dimension, runs no veto, and does not compute the profile-weighted EQS — email-quality-auditor owns all four vetoes (S1/S2/N1/D1) and the EQS rollup.
Quick Start
Build responsive HTML from this creative: [paste subject + body + CTA], destination [URL]
QA this email HTML across Gmail, Outlook, Apple Mail, and mobile: [paste HTML]. Flag dark-mode and image-off breakage.
This renders broken in Outlook and images-off — fix the layout and add fallbacks: [paste HTML]
Skill Contract
Expected output: one email HTML build plus a render-QA report — inline-styled table layout, dark-mode-safe colors, an accessibility checklist result, a client-render matrix (Gmail/Outlook desktop+web/Apple Mail/iOS+Android), image-off fallback notes with bulletproof CTA markup, and a plain-text-parity check against the creative — with the standard handoff summary for memory/email/email-render-builder/.
- Reads: the approved email creative (subject/preheader/body/CTA and its plain-text alternate) or raw HTML to QA; the destination URL; the mode (promo/cold/newsletter); target client list and any brand color/font/logo constraints; the message-match map from email-creative-builder when present.
- Writes: a user-facing HTML build (the rendered E/D unit) plus the render-QA report and a reusable handoff summary.
- Promotes: confirmed render blockers (a client that breaks the layout, an image-only block with no fallback, a dark-mode contrast failure) to
memory/hot-cache.md and memory/open-loops.md; propose durable build decisions (approved template skeleton, brand-safe dark-mode palette) as pending-decision items — never write directly.
