Skip to content
Convert tools

HTML to Pug Converter Online

Convert HTML into Pug (formerly Jade) template syntax, which uses indentation instead of closing tags. Switch between a full document and an HTML fragment, and choose tabs, commas and quote style. The HTML is sent to the server for conversion.

Start a Pug template from existing HTML markup.

HTML is sent to the server for conversion. Use a snippet without confidential data.

Pug output options
Load an example (replaces your input)

HTML

Pug

When to use it

  • Start a Pug template from existing HTML markup.
  • Check how attributes and nesting map to Pug on a short snippet before converting a whole page.

How to use

  1. Paste HTML or load an example (HTML fragment, form attributes, HTML document). Loading an example replaces your input.
  2. Turn on fragment mode to convert only the snippet without html, head and body wrappers. The example below uses fragment mode with tabs and commas on and double quotes off.
  3. Copy the Pug and compile it with your Pug setup to check the rendered HTML.

HTML input

<section class="card"><h2>News</h2><p>Registration is open</p></section>

Pug output (fragment mode, tabs and commas on)

section.card
	h2 News
	p Registration is open

Details and limitations

With fragment mode off, the HTML is treated as a document and html, head and body may be added. Turn it on when you only need the elements.

Mixing tabs and spaces can change parent–child relationships in Pug. Follow your project's indentation style.

Repeated HTML is not turned into Pug each loops, mixins or variables, and external CSS, images and scripts are not included.

The HTML parser may repair incomplete tags. A successful conversion does not validate the HTML or guarantee an identical page.

FAQ

Why are html and body tags added?

In document mode the parser completes the outer elements. Turn on fragment mode to convert a component's HTML without wrappers.

Can I convert HTML to Pug in VS Code or from the command line?

This page runs the open-source html2pug package. Install it from npm to convert files in a script or from the command line, or keep using this page for quick snippets.

How do I turn Pug back into HTML?

This page only converts HTML to Pug. Compile the template with Pug itself — for example with the pug-cli package — to get HTML again.

Is my HTML uploaded?

Yes, it is sent to the douni.one server to be converted. Use code you can share and remove API keys or customer data first.

Specifications and references