Free tool

HTML → Gutenberg Converter

Paste any HTML — an old site, an email builder export, AI output — and get real Gutenberg blocks, not one giant Custom HTML blob. Free.

Most "HTML to WordPress" tools dump your markup into a single Custom HTML block and call it done — you get none of the block editor's actual benefits. This free converter parses any HTML — an old static site, an email-builder export, AI-generated markup — and maps it to real, editable Gutenberg blocks: headings, paragraphs, lists, images, buttons and flex/grid/Bootstrap column layouts all become their native core-block equivalents, with your CSS rolled into a single embedded style block. Paste your markup, convert, paste into the block editor. No plugin, no account — just clean WordPress blocks you can actually edit afterwards.

  1. 1

    Copy your HTML

    Grab the markup from an old site's view-source, an email builder export, or wherever it came from.

  2. 2

    Convert here

    Paste it below and hit Convert. Anything skipped or simplified is listed under the output.

  3. 3

    Paste into Gutenberg

    In the block editor open ⋮ → Code editor, paste, switch back to the visual editor — done.

🔒 Runs entirely in your browser — your pasted content is never uploaded to a server.

HTML Input

Paste any HTML — a full page, a section, an email fragment, or AI-generated markup.

The output is native Gutenberg blocks with one embedded <style> block carrying your design. In the block editor open the ⋮ menu → Code editor (Ctrl+Shift+Alt+M), paste, and switch back to the visual editor.

Dynamic widgets and third-party embeds can't become static blocks — the converter tells you exactly what was skipped.

Gutenberg Blocks Output

Live Preview

From the makers of ready→made

Building from a Figma design instead?

ready→made converts your Figma designs straight into Gutenberg, Oxygen 6, Etch or clean HTML — real structure from a real layout engine.

See ready→made →
FAQ

Good to know.

Is this really free? Do I need a plugin?

Completely free, no plugin — the output is native Gutenberg blocks any WordPress install understands.

What HTML can I paste in?

Anything: a full page, a single section, output from an email builder, or AI-generated markup. Flex, grid and Bootstrap-style column layouts are all recognized and mapped to Gutenberg's Columns block.

Why not just use a Custom HTML block?

A Custom HTML block is a black box — you can't reorder, restyle or reuse the pieces inside the block editor. This tool breaks your markup into real Gutenberg blocks (heading, paragraph, image, button, columns…) so every piece stays editable.

What survives the conversion?

Headings, paragraphs, lists, images, links, buttons, and layout containers (flex/grid/Bootstrap rows and columns) become their native core-block equivalents. Inline and page-level CSS you provide is preserved in one embedded style block.

What can't be converted?

Inline <script> tags and anything that depends on JavaScript at render time are skipped and listed in the conversion notes — Gutenberg blocks are static markup.

Bringing this into Oxygen, Etch or Bricks instead?

Use the dedicated HTML → Oxygen 6, HTML → Etch or HTML → Bricks converter — same input, native output for that builder.

More free tools

Other converters in the suite.

Ready?

Build a real site from your Figma file — in minutes.

menu