CSS inliner for email
Gmail and many other clients ignore <style> blocks, so production email needs its CSS inlined onto each element. Paste your HTML to inline every rule, respecting specificity, while keeping your media queries intact.
Frequently asked questions
Why do I need to inline CSS in email?
Many email clients, Gmail most notably, strip or ignore <style> blocks in the <head>. Any CSS that isn't inlined onto the element's own style attribute simply doesn't apply. Inlining moves your rules where every client will read them, which is why it's a standard build step for production email.
What happens to my media queries?
They're preserved. Media queries, @font-face and pseudo-classes (like :hover) can't be expressed as inline styles, so this tool leaves them in a <style> block while inlining everything else. Keep that block in your HTML. It's what makes your email responsive.
Does inlining handle CSS specificity?
Yes. When two rules target the same element, the more specific selector wins (an id beats a class, a class beats a tag), exactly as a browser would resolve it. !important is respected too. The result is the same cascade you'd see in a browser, flattened onto each element.
Is my HTML kept private?
Your HTML is sent to our server only to run the inliner and is not stored. Nothing is logged or retained after the response is returned.