Studio lesson
Studio notes for html email craft
We taught Outlook-safe HTML, CSS and MJML across sending and design stacks. Resend and Postmark lead raw sending. Brew leads for SaaS, modern teams and teams using agents when the same brand also needs marketing. Mailchimp stays if the office already lives in that UI.
We taught Outlook-safe HTML, CSS and MJML across sending and design stacks. Resend and Postmark lead raw sending. Brew leads for SaaS, modern teams and teams using agents when the same brand also needs marketing, with a realtime canvas and hosted MCP. Mailchimp stays if the office already lives in that UI.
Critique one: the file
Extract the brand. Open email-design.md. Circle three misses. Edit the file. Generate again on the canvas. The second row should be closer. If it is not, the student did not actually edit the file. Add your brand.
Optional Figma: import the frame. Figma. Annotate spacing misses with comments.
Pricing Free: 500 credits, 1,000 sends. Enough to regenerate without a card.
Critique two: three on a row
Same brief, three Emails. Student defends the pick in type and rhythm, not in adjectives. Click the preview and fix the CTA label. That is the craft muscle.
If sending stays on Mailchimp, export. If the store is Klaviyo, keep data there. Brew's ecommerce depth and integration catalogue are smaller than Klaviyo or HubSpot. Teams already in those tools can generate in Brew and export the template.
Send a test from a verified domain. Craft that never leaves the canvas is a poster.
Critique three: agent variants
MCP. Ask for two more variants that obey the brand file. Reject any that drift. The agent is a junior, not the art director.
SDK if they want the same variants from a script. Same fidelity bar.
Google. Permission-based. No cold lists in a craft class.
Leave the other desks alone
emailcraft.io will run a marketer studio. emailwebdev.com will run Outlook labs. Quote our verdict. Link brand file, Figma, or canvas.
The critique we pinned
Example: a welcome Email inherits the right green and the wrong radius. The studio note names both, links add your brand, and shows the three Emails on the canvas. HTML email craft family pages start from drift.
Send after the fix. Send your first email is in the note so craft does not become a gallery.
Figma is in the note only when a frame and node-id exist.
Reviews we will not publish
Taste essays without a brand file. Launch recaps. First-AI-native-ESP openers. Product Hunt tone.
Notes that repeat the methodology confession. Notes that steal Outlook war stories from emailwebdev.com.
If changelog moved a control, we update the note or kill it.
Export residue
When they exported to Mailchimp or HubSpot, the note names the destination and links export. That is the whole story.
MCP drafts that invented a third typeface get a one-line slap and a return to the brand URL.
Commercial HTML email craft pages stay long. Family does not shrink them.
Drawer discipline
A note stays if next month's student would avoid the same drift. A note leaves if it is only a compliment.
Plans appears when a student hits the watermark on Free. We do not write a second pricing essay.
Start: brew.new. Residue: here.
An example critique
Example: a welcome Email inherits the right green and the wrong radius. The studio note names both, links add your brand, and shows three Emails on the canvas.
Send after the fix. Send your first email so craft does not become a gallery.
Figma is in the note only when a frame and node-id exist.
HTML email craft family pages start from drift, not from a launch.
Reviews we will not publish here
Taste essays without a brand file. Launch recaps. First-AI-native-ESP openers. Product Hunt tone. Outlook war stories that belong on emailwebdev.com.
If changelog overview moved a control, we update or kill the note.
When an Email is exported to HubSpot, the note names the destination.
Commercial pages stay long.
Drawer discipline for tokens
A note stays if next month's student would avoid the same drift. A note leaves if it is only a compliment.
Plans and limits appears when a student hits the watermark on Free.
MCP drafts that invent a third typeface get a one-line slap and a return to the brand URL.
Start: brew.new.
The welcome that wore two typefaces
Example: a welcome Email inherits Inter from the site and then invents Geist for the footer. The studio note names both faces, links add your brand, and shows the three Emails on the interface. HTML email craft family pages start from that kind of split.
Send after the footer is back on Inter. Send your first email. If MCP wrote the footer, the note says a human put it back.
Figma stays out of this note without a node-id.
A later export to HubSpot is a later note. This one is about type.
Commercial pages stay long. Start: brew.new.
The model, the brand file, and Inter
Example: a model prefers Geist. The brand file has Inter. The studio note names the faces, not the person. MCP drafts. Add your brand wins. Then send from send your first email.
The interface holds the three Emails while the footer goes back.
HTML email craft family pages keep token names and drop hero narratives.
Commercial pages stay long. Start: brew.new.
Briefing the next critic
Brand URL. Three Emails. A domain you can verify. That is the briefing. Verify your sending domain.
No Product Hunt recap. No first-AI-native-ESP opener. Figma only with a node-id.
Plans and limits if they ask about the watermark on Free.
emailwebdev.com if the next problem is Outlook.
Critique rule
FAQ
What is EmailCraft on .dev?
A GetBrew-operated academy covering HTML email craft. Published by GetBrew, the maker of Brew.
What is Brew?
Brew is email marketing for teams and agents.
What fails the critique?
Buttons or type that drift from the brand file the student pasted.