Summary
Pulls 19 HTML email coding rules and 6 component patterns directly into your AI client so Claude or Cursor generates templates that actually render in Outlook 2007 through 365, Gmail, and Apple Mail. Exposes structured tools for fetching bulletproof button markup with VML fallbacks, spacing patterns, MSO conditionals, and dark mode handling. You'd reach for this when building transactional or marketing email templates and you're tired of AI hallucinating table structures that break in Outlook or forgetting inline styles. Also includes a playground with screenshot-to-HTML conversion. Available as an npm package or a hosted JSON-RPC endpoint if you don't want to install locally.
Keeps your Mac awake while Claude Code, Codex or Cursor works. Lets it sleep when they are done.
Try free for 7 days →
Block distracting apps from your iPhone permanently without a 3rd party app. Free and open source.
Block now (100% free) →
Notes, actions and memory. Without a meeting bot. First month 100% off.
Download for free →
belt cli automatically finds the best tools and skills for your agent. image, video, music, tts...
one prompt install →
Free an open-source skills that make AI coding agents easier to understand, verify, and control.
Download for free →
Connect your Claude agent to live crypto prices and trading routes via 1inch
Get the MCP →Osama Hassouna · Docs
Source for docs.osamahassouna.com — an engineering reference hub I keep open while building. Currently one guide is live, with more landing as I write them.
Live now
HTML Email Playbook
A working reference for hand-building HTML email templates that render reliably across Outlook (Windows desktop, 2007 through 365), Gmail web + mobile, Apple Mail, Yahoo Mail, and the long tail of clients that haven't moved past 2007.
Covers:
- Structure — doctype, head boilerplate, body container, header / body / footer organization
- Components — bulletproof CTA buttons (with Outlook VML fallback), spacing patterns, images, inline icons, background images, text
- Compatibility — Outlook MSO conditional comments, RTL languages, hybrid responsive layouts
- Production — Gmail 102KB clipping, dark mode, preheader text
- AI Generation — rules and patterns for AI tools that generate playbook-compliant email HTML
Read it: docs.osamahassouna.com/email-playbook/
There's also a Playground at /email-playbook/playground/ with a live editor, instant preview, and a "From Image" tab that converts a design screenshot into playbook-compliant HTML.
Use the playbook in your AI workflow
The playbook is published as an MCP server + terminal CLI so AI clients (Claude Desktop, Cursor, Cline, etc.) can pull rules and component patterns directly into their reasoning. The model calls structured tools to fetch the exact patterns from the playbook instead of guessing from training data.
npm install -g email-playbook-mcp
Setup, tool reference, and Claude Desktop / Cursor config snippets:
docs.osamahassouna.com/email-playbook/mcp/
There's also a hosted JSON-RPC endpoint at docs.osamahassouna.com/api/mcp if you'd rather not install anything.
License
MIT. Playbook content © Osama Hassouna · osamahassouna.com
Featured
Keeps your Mac awake while Claude Code, Codex or Cursor works. Lets it sleep when they are done.
Try free for 7 days →Block distracting apps from your iPhone permanently without a 3rd party app. Free and open source.
Block now (100% free) →Notes, actions and memory. Without a meeting bot. First month 100% off.
Download for free →belt cli automatically finds the best tools and skills for your agent. image, video, music, tts...
one prompt install →Free an open-source skills that make AI coding agents easier to understand, verify, and control.
Download for free →Connect your Claude agent to live crypto prices and trading routes via 1inch
Get the MCP →Categories
Registryactive
Packageemail-playbook-mcp
TransportSTDIO, HTTP
UpdatedJun 2, 2026
