HTML formatter and beautifier

Indent HTML fragments while preserving attributes, text and pre, script and style blocks. Copy the code and review whitespace.

Processed in your browser: your data are not uploaded.

Set your data

Set your data

At most 100,000 characters and 10,000 tokens. HTML only: no validation or JSX conversion. Block whitespace can change.

Result

Enter your values to see the result.

We count which tools are used most, without including entered values or file contents in the statistics. Privacy

How to use it

Work on a copy and format HTML source only. The tool preserves attributes and pre, script, style, textarea and title blocks while adding or replacing whitespace between block elements. It neither converts JSX nor validates the document.

Example inputs
InputResult
<div><p>A <strong>B</strong> C</p></div><div> <p>A <strong>B</strong> C</p> </div>

Method and limits

Indentation adds or replaces whitespace between block elements. Check rendering with CSS white-space. This is not a validator or an executable preview.

Example

Usage scenario

Input
<div><p>A <strong>B</strong> C</p></div>
Result
<div> <p>A <strong>B</strong> C</p> </div>

In a fragment containing A, a strong element and a final word, the spaces around strong separate three words. Keep them. A pre block containing newlines and leading spaces must preserve that content even when its outer container is indented.

What are the limits of this tool?

At most 100,000 characters and 10,000 tokens. HTML only: no validation or JSX conversion. Block whitespace can change.

Inputs and results are processed in your browser and are not sent to the server. Aggregate statistics, when enabled, record only the tool and outcome, without the content.

Sources

PRACTICAL GUIDES

HTML whitespace: formatting code with care

Learn which spaces can change a rendered page and what to check after indenting an HTML fragment.

Follow the steps

Favorites