The gap isn't usually the headline copy or the hero image. It's three things that most designers don't check systematically: CTA button contrast below 4.5:1, a layout hierarchy that collapses on 375px screens, and a single-column stack that buries the offer below the fold on mobile.
I built kopi to catch those before send. Every email it generates gets scored across 12+ criteria — layout hierarchy, mobile readability, CTA contrast, whitespace distribution, font size at mobile breakpoints — on a 0–100 scale. The score isn't decoration; the critique tells you exactly which criterion failed and why.
Here's what a 70 typically looks like in the output:
CTA contrast: 62/100
Reason: Button background (orange, ~2.8:1 on white) falls below the
4.5:1 minimum for interactive elements.
Fix: Darken the swatch until contrast clears 4.5:1.
Mobile readability: 58/100
Reason: Three-column layout at 600px collapses to 187px columns at 375px.
Body copy renders at 9px — below the 16px minimum for mobile legibility.
A 93 has cleared all of that. The CTA is readable under WCAG AA, the layout reflows cleanly to single-column, the hierarchy leads with the offer rather than the brand logo.
The public gallery at https://trykopi.ai/emails has 400+ emails scored 80 or above — useful if you want to see what high-scoring designs actually look like across categories before you generate your own.
Generation takes under 5 minutes from a text prompt. It integrates with Klaviyo for direct export, and there's an MCP server if you're working in Claude Code or Cursor and want email generation inside your existing workflow.
Top comments (0)