Email HTML Linter
Lint your email HTML against Can I Email data — catch Outlook, Gmail, and Apple Mail rendering issues before you send.
About this tool
Email HTML is a minefield. What looks perfect in your browser can render as a broken mess in Outlook (which uses Word's rendering engine), get stripped by Gmail (which removes <style> blocks), or behave unpredictably in Apple Mail.
This linter scans your email template against data from Can I Email — the community-maintained reference for HTML and CSS support across email clients. It checks every element, CSS property, and pattern in your template, then shows you exactly which email clients will have trouble with each one.
Example: paste a template using display:flex, border-radius, or <style> blocks — the linter flags them with line numbers and explains that Outlook doesn't support flexbox, doesn't render rounded corners, and that Gmail strips <style>.
Data source: curated subset of caniemail (MIT license). Covers HTML elements, CSS properties, media queries, CSS variables, rgba/hsla without hex fallback, relative units (rem/em/vw/vh), and more.
FAQ
Why does Outlook break my email? ›
Outlook on Windows uses Microsoft Word's HTML rendering engine (not a web browser engine). This means no flexbox, no CSS grid, no border-radius, no CSS transforms, no max-width, no opacity, and limited background-image support. Always design emails with table-based layouts and use VML or conditional comments for Outlook-specific fallbacks.
Why does Gmail ignore my CSS? ›
Gmail strips <code><style></code> blocks from your email — it only respects inline styles (the <code>style="..."</code> attribute directly on elements). Gmail also strips <code><svg></code>, <code><video></code>, <code><picture></code>, and does not support web fonts via <code>@font-face</code> (except for Google Fonts in some cases).
What is the safest way to code an email? ›
Use table-based layouts with inline styles. Stick to widely-supported CSS (padding, margin, color, background-color, font-size, text-align, width, height). Always add hex fallbacks before rgba values. Use 600px max-width via conditional comments for Outlook. Test in Litmus or Email on Acid before sending.
Can I use CSS variables in email? ›
No. CSS custom properties (<code>var(--my-color)</code>) are not supported in Outlook, Gmail, Yahoo, or Samsung Email. Apple Mail supports them, but designing for Apple-only reach is rarely practical.