About the HTML Formatter
Turn minified or messy HTML into clean, readable, consistently indented markup. Embedded <style> and <script> blocks are formatted too.
Key features
- Beautifies minified or messy HTML
- Formats embedded CSS and JavaScript too
- 2 spaces, 4 spaces or tabs
- Line width of 80, 100 or 120
- Syntax highlighting and error messages
- Private: runs in your browser
Make HTML readable again
Minified HTML from a website, a one-line email template or markup exported from a page builder is hard to read and edit. Paste it in to get clean, consistently indented HTML, with embedded <style> and <script> blocks formatted too.
Before and after
<div class="card"><h1>Hello</h1><p>Some <strong>text</strong>.</p><ul><li>One</li><li>Two</li></ul></div>
becomes
<div class="card">
<h1>Hello</h1>
<p>Some <strong>text</strong>.</p>
<ul>
<li>One</li>
<li>Two</li>
</ul>
</div>
When to use it
- Inspecting a page's source that was minified for production.
- Cleaning up email templates and CMS exports before editing.
- Code reviews: consistent formatting makes real changes easier to spot.
- Learning: indentation shows how elements are nested.
Related tools
CSS formatter, JavaScript formatter, HTML to Markdown, and HTML to text.
How to use the HTML Formatter
- Paste your code into the input box, upload a file, or click Sample to try it out.
- Choose the options you want, such as indentation, line width or dialect.
- The result appears instantly in the output panel. Syntax errors are shown with their line and column.
- Click Copy to copy the result, or Download to save it as a file.