Install any skill in seconds. Free to start, no credit card required.
Get Started Free →chunkydotdev/template-design
Build HTML email templates that render everywhere.
Passed 22 of 23 test cases with the skill, and 21 of 23 without it.
1 fixed21 passed either way1 still failing0 broke
Tokens, turns and time describe resource use, not a dollar price.
A test case the skill fixed. Same model, same prompt, with and without the skill.
Our team's HTML email newsletters are getting cut off in Gmail and occasionally flagged by spam filters due to layout and media density issues. Could you provide a refactored template layout structure along with guidance on design guidelines to prevent truncation and pass common email linter checks?
| Checked | Without skill | With skill |
|---|---|---|
| Includes the VML namespace attribute xmlns:v in the html element | Missed | Passed |
| Identifies 102KB as the HTML size limit before Gmail truncates the message | Passed | Passed |
| Specifies individual directional padding properties instead of CSS shorthand padding | Missed | Passed |
The instructions your model reads when the skill loads.
Build HTML email templates that render correctly across every major email client.
email-copywriting - writing email content that people actually readspam-filter-avoidance - content patterns that trigger spam filtersemail-compliance - legal requirements including unsubscribe linksab-testing - testing different template variantsEmail HTML is not web HTML. There are no standards for how email clients render HTML and CSS. Every client does it differently, and the worst offender - Outlook on Windows - uses Microsoft Word's rendering engine, not a browser engine. This means you're building for a fragmented landscape where the rules of web development don't apply.
The core principle: code for the worst client, enhance for the best.
Start every email template with this skeleton:
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
test cases passed, vs 21 / 23 without
Published skills whose descriptions closely match this one, with their headline benchmark lift.
More skills from the same source and nearby in the registry, with their headline benchmark lift.