Make any HTML safe to paste into systeme.io
Paste any HTML on the left. The converter strips the head wrappers that systeme.io's Raw HTML element rejects (DOCTYPE, html, head, body, meta, title, link), keeps your font @import alive, pulls out images embedded as base64 so the paste is small enough to accept, and settles the handful of CSS rules that fight the editor. Every change is listed next to the output.
Paste your HTML
Three steps, one minute, zero broken pastes.
No upload, no signup, no API. The converter runs the full systeme.io transform list on your HTML directly in your browser.
Paste your HTML
A full document, a fragment, an AI-generated landing page, a snippet from an old site. The converter handles all of them.
Click Convert
The converter strips the head-only tags systeme.io rejects, converts your font link to an @import, and shows every change it made.
Paste into systeme.io
Copy the output, open a Raw HTML element inside any systeme.io page, and paste. The page renders without editor conflicts.
The full transform list.
Each rule below maps to a real conflict with systeme.io's editor. Every transform is conservative, reversible by editing the output, and logged so you can see what changed.
Outer wrappers stripped
<!DOCTYPE>, <html>, <head>, and <body> are removed. Only the inner content survives, since the Raw HTML element rejects those wrappers.
Embedded images pulled out
Images saved into the HTML as data:image/...;base64 are extracted into real files you can download, and each one is swapped for a placeholder URL. This is the most common reason a paste is refused: base64 inflates a file by about a third, so a page with a dozen photos can reach 10 MB of text and systeme.io answers with a generic "Something went wrong". Identical copies of the same image are collapsed into one file. Small icons stay inline, since a URL would cost more than they do.
Font @import moved inside body
Google Font <link rel="stylesheet"> tags from the head are converted into @import at the top of a <style> block in the body, where systeme.io will actually parse them.
Meta, title, non-font links dropped
<meta>, <title>, and <link> tags that are not stylesheets get stripped. They are forbidden in the Raw HTML element and the page handles those concerns through systeme.io's SEO panel instead.
Bare * rules removed
CSS rules that lead with the universal * selector (e.g. *, *::before, *::after { box-sizing: border-box; }) are deleted, because they cascade into systeme.io's own toolbar and section handles. Scoped descendants like .card * and attribute selectors like [data-x*="y"] are kept as-is.
High z-index clamped to 19
Any z-index value above 19 (in stylesheet rules or inline style attributes) is clamped down to 19. systeme.io's editor chrome (toolbar, hover handles, section frames) sits at higher stacking values, so anything 20+ floats above the editor UI and blocks clicks. Values of 19 and below pass through unchanged.
Fixed and sticky positions rewritten
position: fixed becomes absolute and position: sticky becomes relative. Both pin an element to the editor viewport, where a sticky navbar or a full-screen modal sits on top of systeme.io's toolbar and covers the handles you need to select a section. This one changes how the page behaves, so it is called out in the log: anything that used to stay put while scrolling will now scroll with the page.
Font weights capped at 600
font-weight of 700, 800, 900, or bold is reduced to 600, the heaviest weight systeme.io renders reliably, even when the font file itself ships the heavier cuts. Weights of 600 and below are left alone.
Left alignment forced
systeme.io renders a Raw HTML element inside a centered container, and text-align is inherited, so any text that never states its own alignment quietly comes out centered. The output is wrapped in a container that sets text-align: left, which restarts that inheritance: text that had no alignment of its own now takes left from the wrapper instead of center from systeme.io.
Only that text moves. Anything the page aligns itself, in a stylesheet rule or an inline style attribute, outranks a single class selector and is left exactly as it was, so sections you centered on purpose stay centered. Table headers and captions keep the centering browsers give them by default.
Common questions.
Two things cause it. The first is a small set of tags that belong in the document head: <html>, <head>, <body>, <meta>, <title>, and <link>. Pasting a full HTML document containing them fails. The converter strips those wrappers, and font links get special treatment: instead of being dropped they become @import at the top of a body <style> block so your fonts still load.
The second is size, and it is the one people rarely guess. If your images were saved into the HTML as base64 rather than linked by URL, the file can reach several megabytes of text, and an oversized paste is refused with the same unhelpful "Something went wrong". The converter extracts those images so the payload drops back to something the editor accepts.
No. The entire conversion runs in your browser. Nothing is uploaded, logged, or stored on systeme.io's servers. The HTML you paste stays on your machine.
Eight transforms. It strips outer wrappers (<!DOCTYPE>, <html>, <head>, <body>); drops <meta>, <title>, and non-stylesheet <link> tags; converts font <link rel="stylesheet"> tags into @import inside a body <style> block; extracts base64-embedded images into downloadable files; removes CSS rules that lead with the bare universal * selector; clamps any z-index above 19 down to 19; rewrites position: fixed and sticky to absolute and relative; caps font-weight at 600; and wraps the result in a left-aligned container so nothing inherits systeme.io's centering.
Scoped rules like .card * and attribute selectors like [data-x*="y"] are kept as-is. Everything else (other CSS, scripts, structure, classes, attributes) is preserved exactly as you wrote it, and the panel next to the output lists every change with a count.
They come out as separate files you can download from the panel under the output, and each one is replaced in the HTML by a placeholder URL. Upload the files to systeme.io's media library (or any host), copy the address of each, and replace the placeholder in the output before you paste. Until you do that, the images will not load.
It is an extra step, but there is no way around it: an image stored as base64 lives inside the HTML itself, and a page carrying several of them is simply too large for the Raw HTML element to accept. Pulling them out is what makes the paste possible. It also makes the published page faster, because browsers can cache real image files while base64 has to be re-downloaded with the page every time.
Almost always, and the exceptions are listed for you. Your CSS, layout, classes, scripts, and content are preserved, so anything that renders fine in a standalone file renders the same way after conversion. Three changes can be visible, and each is reported with a count next to the output. Extracted images show as broken until you upload them and swap the placeholder URL. Elements that were fixed or sticky (a pinned navbar, a modal, a lightbox) now scroll with the page, because systeme.io's editor cannot allow either. And text set in 700 or heavier renders at 600, which is a small difference in thickness rather than a layout change.
Because the Raw HTML element sits inside a container that systeme.io centers, and text-align is one of the properties children inherit from their parent. Any text in your HTML that never states its own alignment inherits that centering, which is why it looks correct in a standalone file and wrong once pasted. It usually hits body copy and list items first, since those are the things people rarely align explicitly.
The converter handles it automatically: the output is wrapped in a container set to text-align: left, so alignment is inherited from your own wrapper instead of from systeme.io's. Only the text that had no alignment of its own is affected. Anything you deliberately centered keeps its centering, because those rules live in your CSS and outrank the single class selector the converter adds.
Yes. The output panel is fully editable. Tweak anything by hand, then click Copy. You can also re-run Convert on the modified output to verify nothing new slipped in.
Yes, completely free with no signup. systeme.io itself is also free to start: 2,000 contacts and three funnels at $0, no credit card needed.
Build the page in seconds, ship it in minutes.
Use the AI prompt generator to draft any page, the converter to clean it up, and systeme.io to host the whole funnel. Free to start with 2,000 contacts and three funnels.
Start free