Free, private, no-signup inline CSS styler — paste or upload Markdown, get email-client-safe HTML.
Most email clients render HTML with their own stripped-down engine instead of a real browser, and Outlook is the strictest of all. Since 2007, desktop Outlook has used Microsoft Word's rendering engine to display HTML email instead of a browser-based engine like Chromium or WebKit. Word was built to render documents, not web pages, so it only understands a limited subset of CSS — and one of the first things it does is strip <style> blocks out of the <head> entirely, along with most CSS classes and IDs.
That means any CSS written the normal way — a stylesheet, or a <style> tag at the top of the HTML — simply won't apply once the email lands in Outlook. Text meant to be teal renders in default black. A carefully chosen font falls back to Times New Roman. Padding and spacing collapse.
The fix is to skip the stylesheet entirely and write every style directly on every element, as an inline style attribute. Word's rendering engine reads inline styles even though it ignores <style> blocks, so a declaration likecolor: #0D9488; font-family: Arial, sans-serif; written directly on a <p> tag survives the trip. This is called CSS inlining, and it's standard practice across every serious email service provider and email-building tool — not a workaround specific to one platform.
Other clients (Gmail, Apple Mail, Yahoo) are more forgiving but still strip external stylesheets and sometimes internal <style> blocks depending on context — webmail versus app, forwarded messages, and so on — so inlining is the safe default across all of them, not just Outlook.
Doing this by hand is tedious and error-prone: every paragraph, heading, and link needs the same style declaration copied onto it manually, and every one needs updating again if the color scheme changes. That's what this tool automates — write normal Markdown, and it outputs HTML with every style already inlined per element, matching what actually survives Outlook's Word-based renderer.
Outlook (desktop, classic layout) uses Microsoft Word's rendering engine instead of a browser engine, so it ignores style blocks and most CSS classes. Only inline styles survive. If an email wasn't built with inlined CSS, Outlook shows it with default fonts, colors, and spacing instead of the intended design.
It means moving every CSS property from a shared stylesheet or style block directly onto each individual HTML element as a style attribute, instead of referencing a class or ID. It produces more repetitive HTML, but it's the format email clients reliably render.
Yes — all conversion happens entirely in the browser via JavaScript. The Markdown and generated HTML are never sent to a server, uploaded, or stored anywhere.
Yes. Copy the generated HTML and paste it into the ESP's raw HTML or code-block editor. Most ESPs support pasting inlined HTML directly.
Yes — headings, bold and italic text, links, ordered and unordered lists, blockquotes, inline code, horizontal rules, images via URL, and tables are all supported.
Because Outlook's Word-based rendering engine strips style blocks (and most CSS selectors) from the email entirely, so nothing inside them applies. Inline styles are the only format that reliably renders across major email clients.
Inlining CSS ensures your styles survive clients that strip stylesheets, but it doesn't guarantee pixel-identical rendering everywhere. Some clients (notably Outlook.com and Apple Mail) apply their own dark-mode color adjustments that can't be fully controlled from the HTML. Always send yourself a test email before a real campaign.
Yes — two small additions built specifically for email. Callout boxes: start a blockquote line with [!tip], [!warning], [!info], or [!note], optionally followed by a title, e.g. "> [!tip] Worth knowing" with your message on the next line(s). CTA buttons: [!button](https://your-link.com "Button Text") renders a standalone, table-based button. Both come out fully inlined, table-based HTML built the same email-client-safe way as the rest of the output — the pre-filled example in the input pane includes one of each so you can see them immediately.
Want more on this topic? Read more in our blog for deeper guides on email-safe HTML, CSS inlining, and writing newsletters in Markdown.