HTML Live Editor

How to use the html live editor

1. Type or paste HTML on the left.
2. Watch the rendered result update.
3. Download the file if you want to keep it.

About this tool

Markup on the left, rendered result on the right, updating as you type. It is the quickest way to check what an element actually does, or to try a structure before committing it to a real page.

Rendering is what the browser does, not an approximation of it — so what you see is what that element genuinely produces in this browser, including the parts people misremember. Nested lists, table structure and form controls all behave exactly as they would in a page, because they are in one.

The result runs in a sandboxed frame with `allow-scripts` and deliberately without `allow-same-origin`. Those two together let the frame reach back into the page that hosts it, its storage and its cookies — granting both is the standard way a sandbox gets quietly undone, and it is a common mistake in tools of this kind. Without same-origin the frame has an opaque origin: your code runs, and can see nothing of the page around it.

Nothing is saved. Leaving the page discards what is in the editor, which is the trade for a tool that needs no account and stores nothing about you. Download the file if you want to keep it.

Common uses

• Checking how an unfamiliar element renders.
• Trying a markup structure before adding it to a page.
• Teaching or demonstrating how HTML works.

Frequently asked questions

Is my markup uploaded?

No. It is rendered in a frame in this tab and nothing is sent anywhere.

Can the preview affect this page?

No. The frame is sandboxed without same-origin access, so it cannot reach this page, its storage or its cookies.

Is my work saved?

No. Leaving the page discards it, which is the trade for a tool that keeps nothing about you. Use the download button to keep a copy.