HTML formatter.

How to prettify HTML

Paste your markup into the HTML box, choose 2 spaces, 4 spaces or tabs from Indent, and press Format. The result appears in the Output panel with a Copy button and a Download .html button. Press Minify to do the reverse and strip comments and the white space between tags. People call this HTML prettify, HTML pretty-print, HTML beautifier or HTML prettifier. They all mean the same operation: reprint the markup with one tag per line, indented by nesting depth, so you can read the structure.

Worked example

This 232-character document sits on a single line, the way it arrives from a minified build or a copied network response:

<!DOCTYPE html><html><head><title>Demo</title><meta charset="utf-8"></head><body><ul class="nav"><li><a href="/">Home</a></li><li><a href="/about/">About</a></li></ul><p>Hello <b>world</b>!</p><img src="a.png" alt="A"></body></html>

With 2-space indent the formatter prints every tag and every run of text on its own line. The first lines are:

<!DOCTYPE html>
<html>
  <head>
    <title>
      Demo
    </title>
    <meta charset="utf-8">
  </head>
  <body>
    <ul class="nav">
      <li>
        <a href="/">
          Home
        </a>
      </li>

Two details show how the tool decides indentation. The <!DOCTYPE> line and comments do not open a level, and neither do void elements such as <meta> and <img>, which have no closing tag. The tool treats these as void: br, hr, img, input, link, meta, area, base, col, embed, param, source, track and wbr.

What minify does, with numbers

Input of 55 characters, <div> then a comment, then <p> Hello world </p> on separate indented lines, minifies to the 31-character <div><p> Hello world </p></div>. Comments go, white space between tags goes, and every other run of white space becomes a single space. The output label reports the new length and the number of characters removed.

Know what this formatter does to your markup

This is a deliberately simple tool: it splits the text at every tag and indents by counting opening and closing tags. That is fast and predictable, but it means some inputs need care.

• Inline text is split across lines. <p>Hello <b>world</b>!</p> becomes five lines. In HTML a line break between elements renders as a space, so the result shows “Hello world !” instead of “Hello world!”. Use the formatted text to read structure, and be careful before pasting it back into a page where inline spacing matters.
• Preformatted text is reindented. Content inside <pre> or <textarea> is white-space sensitive. The tool trims and indents it, and minify collapses it, so do not run those blocks through either action.
• Inline scripts and styles may break. The splitter treats any < followed later by > as a tag. A script such as if (a<b) {x()} is cut at the less-than sign. Format scripts with the JS formatter and styles with the CSS formatter.
• Optional end tags push the indent. HTML lets you omit some closing tags (for example </li> and </p>). The tool cannot know that an element ended, so later lines stay indented one level too deep.
• A > inside an attribute value ends the tag early, as in title="a>b".

For a build pipeline or a large file, use a full formatter such as Prettier, which understands inline and white-space-sensitive elements. This page is for a fast, private look at markup you already trust.

Formatting is not validation

Neither action checks that your HTML is valid or fixes mistakes, such as a missing closing tag or an element in the wrong place. If the page looks wrong after you format it, run the markup through the HTML validator. To compress markup for production beyond whitespace removal, use the HTML minifier.

Privacy

The text is processed in the page’s own script. Nothing is uploaded and nothing is stored, so you can paste internal templates. Download .html saves the result as formatted.html on your device.

Sources

Each source below was opened and checked in October 2026 (retrieved 2026-10).

• WHATWG, HTML Living Standard: Syntax: void elements, comments, and which end tags may be omitted
• MDN, How whitespace is handled by HTML: why line breaks between inline elements render as a space
• MDN, The Preformatted Text element: white space inside pre is significant