Marketing email template builder · free AI skill

Builds a complete modular marketing email — subject line variants, preheader, and a stack of reusable content blocks in both responsive HTML and plain-text versions — populated from a campaign brief. Use when building a…

Purpose

Produce a send-ready marketing email as a stack of modular content blocks — subject lines, preheader, hero, body sections, and CTA — delivered in responsive inline-styled HTML plus a plain-text version, populated directly from a campaign brief. Lets a lifecycle team ship on-brand emails at scale without routing every send through an agency or designer.

When to Use

Invoke this skill when the user asks to:

Build a marketing email or email template from a campaign brief
Create send-ready HTML for a promo, announcement, or nurture email
Produce a modular block system they can reuse across future sends
Generate matching subject line and preheader options for an email
Convert a campaign concept into both HTML and plain-text versions
Draft a lifecycle email (welcome, re-engagement, upsell, event) with a clear CTA

Inputs Required

Before starting, collect:

Campaign type: Promo / announcement / newsletter / welcome / re-engagement / event / product update
Primary goal: The one action this email should drive (click to page, RSVP, redeem code, reply, upgrade)
Audience: Who receives this — segment, lifecycle stage, or list description
Core message: The single most important thing the reader must take away
Offer/CTA details: Button text, destination URL, and any offer specifics (discount, deadline, feature)
Brand basics: Brand name, primary color (hex), tone (bold / warm / professional / playful)
Personalization tokens: Any merge fields to use (e.g., first name, plan name) and the ESP's token syntax if known

If brand color or token syntax is missing, default to a neutral palette and {{first_name}} style tokens, and note the assumption.

Instructions

Step 1: Map the Block Stack

Choose the block sequence that fits the campaign type. Use this as the default skeleton, adding or removing blocks per goal:

Preheader (hidden inbox preview text, 40–90 chars)
Header block — logo/brand name, optional nav or tagline
Hero block — headline + supporting line + primary CTA button (above the fold)
Body block(s) — 1–3 sections carrying the core message; each is a self-contained module
Secondary CTA / reinforcement block — restates the action for skimmers
Social proof or urgency block — optional; use only when real (testimonial, stat, deadline)
Footer block — address line, unsubscribe, preference center, legal

Match stack density to type: promos run lean (hero + one body + CTA), newsletters run modular (multiple stacked body blocks), lifecycle emails lead with one clear message and one CTA.

Step 2: Write Subject Lines and Preheader

Produce 5 subject line variants across distinct angles, each ≤50 characters:

Direct/benefit — states the payoff plainly
Curiosity — opens a loop tied to the core message
Urgency/timeliness — only if a real deadline exists
Personalized — uses a token or segment reference
Short/punchy — 3–5 words for inbox scannability

Write 1 preheader (40–90 chars) that complements the subject rather than repeating it, and does not leave dead preview text.

Step 3: Write Block Content

For each block in the stack, write copy calibrated to the brand tone and audience:

Hero headline: one line, ≤10 words, leads with the reader's benefit
Body sections: each has a mini-headline and 1–3 short sentences; one idea per block; scannable
CTA buttons: action-first, ≤4 words (e.g., "Claim my spot," "Start free trial") — never "Click here"
Insert personalization tokens where they earn attention, not decoratively

Step 4: Build the Responsive HTML

Assemble the blocks into a single email-safe HTML document:

Use table-based layout (<table role="presentation">), not divs/flexbox — required for Outlook and older clients
Apply inline styles on every element; do not rely on a <style> block for critical layout
Constrain content width to 600px max, centered, on a full-width background container
Style the CTA as a bulletproof button (padded anchor inside a table cell with background color)
Use the brand primary color for the button and accent elements; keep body text #333 on white
Set the preheader as hidden text at the top (display:none;font-size:1px;color:#fff;) followed by whitespace-collapse characters
Include alt text on any image placeholders and keep image references as descriptive placeholder URLs the buyer swaps in
Mark each block with an HTML comment (e.g., ) so it can be reused or removed cleanly

Step 5: Generate the Plain-Text Version

Produce a plain-text alternative that carries the same message:

No HTML, no markdown — line breaks and spacing only
Full destination URLs written out (not hidden behind link text)
Keep the CTA line visually separated
Include the unsubscribe/address line in text form

Step 6: Add Usage Notes

List the merge tokens used, the recommended send segment, and one A/B test suggestion (which subject variants or CTA to pit against each other).

Output Format

Structure: Delivered in labeled sections — Subject Lines → Preheader → Block Stack Overview → HTML → Plain-Text → Usage Notes
Length: 700–1,100 words of surrounding content plus the full HTML and text bodies
Format: HTML in a fenced code block; plain-text in a separate fenced code block; subject lines and notes as lists
Sections: 5 subject variants, 1 preheader, annotated block stack, complete inline-styled HTML, plain-text version, usage notes with A/B suggestion
Tone: The email copy itself matches the brand tone provided; the surrounding guidance is practical and direct

Quality Checklist

Before delivering output, verify:

[ ] Exactly 5 subject line variants across the 5 distinct angles, each ≤50 characters
[ ] Preheader is 40–90 characters and does not duplicate the subject line
[ ] HTML uses table-based layout with inline styles and a 600px max content width
[ ] The CTA is a bulletproof button using the brand color, with action-first text (no "Click here")
[ ] Every block is labeled with an HTML comment so it can be reused or removed
[ ] A plain-text version exists with full URLs written out
[ ] No unresolved bracket placeholders remain in the copy — only intentional merge tokens

Notes

Table-based HTML with inline styles is non-negotiable for Outlook rendering — a beautiful div-based email will break for a large share of recipients
Urgency and social proof blocks should be dropped entirely if the campaign has no genuine deadline or proof point — fabricated scarcity erodes list trust
The commented block structure is the reuse engine: once one email is built, the buyer can swap the hero and body blocks to produce the next send in minutes
Keep total image reliance low; many clients block images by default, so the core message and CTA must survive with images off

How to use this skill

This file is a Claude Code skill in Anthropic's standard format — markdown with YAML frontmatter at the top.

Installing in Claude Code:

~/.claude/skills/<folder-name>/SKILL.md — auto-loads in every session anywhere on your machine (recommended for skills you'll use across multiple projects)
<your-project>/.claude/skills/<folder-name>/SKILL.md — auto-loads only when working in that project (recommended for project-specific skills)

Restart Claude Code or open a new session to register.

Using in Claude.ai, ChatGPT, Gemini, or other AI tools:

Drag this file into a new chat, or copy and paste its contents
Send your task or request as your next message — the AI will apply the skill where it fits

For Claude Code skill details: https://docs.anthropic.com/en/docs/claude-code/skills