Email Forge
Modern designs in, battle-tested table-layout HTML email out
HTML email development is universally the most hated task in web design. Outlook uses Word's rendering engine. Gmail strips your style tags. This recipe converts your design into bulletproof table-based email HTML that works everywhere — including dark mode.
INGREDIENTS
PROMPT
Create a skill called "Email Forge". When I describe an email layout or provide a design mockup, generate production-ready HTML email code. Use table-based layout with inline CSS. Include MSO conditional comments for Outlook, VML fallbacks for background images, bulletproof buttons (not image-based), and Gmail-safe inline styles. Generate a dark mode variant using prefers-color-scheme media queries with reviewed color overrides, and provide non-transparent logo versions for clients that force dark mode. Add responsive stacking for mobile with media queries (as progressive enhancement). Document known rendering differences across Outlook (desktop, web, mobile), Gmail (web, app), Apple Mail, Yahoo, and Samsung Mail. Target 600px max width. Use web-safe font stacks with fallbacks.
How It Works
Describe your email layout or paste a design screenshot, and your Claw
generates production-ready email HTML using tables, inline styles, and all
the ugly hacks that make email work in modern inbox clients. It handles Outlook's Word
engine, Gmail's CSS stripping, and dark mode color inversions.
What You Get
- Table-based HTML layout with inline CSS (the only thing that works everywhere)
- MSO conditional comments for Outlook-specific fixes
- VML backgrounds for Outlook (because it ignores background-image)
- Bulletproof buttons (not image-based, works without image loading)
- Gmail-safe styles (everything inlined, no `