Developer Tools

HTML Formatter & Beautifier

Clean up messy, minified or copy-pasted HTML with consistent indentation. Embedded <style> and <script> blocks are formatted too, and you can minify HTML when you need a compact version.

Format HTML

Paste HTML, choose the indentation and press Format.

How to Format HTML

  1. Paste your HTML: a full page, a snippet from an email template, or minified code copied from a browser.
  2. Choose 2 spaces, 4 spaces or tabs, and whether long tags should have each attribute on its own line.
  3. Press Format, then copy or download the result. Press Minify for a compact single-line version.

What the Formatter Does

  • Indents nested elements so the structure of the page is easy to follow.
  • Formats CSS inside <style> tags and JavaScript inside <script> tags.
  • Keeps inline elements such as <a>, <strong> and <span> on the same line as their text.
  • Leaves the content of <pre> and <textarea> untouched, because whitespace matters there.

It uses js-beautify, the open-source formatter behind many code editors and online tools. Formatting changes only whitespace, so the page looks and behaves the same.

When to Minify HTML

Minifying removes comments and the whitespace between tags to make files smaller. It is useful for email templates with size limits and for embedding HTML in JavaScript or JSON. For websites, server compression (gzip or Brotli) already removes most of the benefit, so readability usually matters more. Conditional comments for Outlook (<!--[if mso]>) are kept.

Tips

  • If the output looks wrongly nested, check for a missing closing tag such as </div>. The formatter shows the structure the code actually has.
  • Template syntax from PHP, Blade, Django or Handlebars is usually preserved, but check complex templates after formatting.

Privacy

Your code is formatted in your browser and never uploaded.

Frequently Asked Questions

Will formatting change how my page looks?

No. Only indentation and line breaks between tags change. Content inside pre and textarea elements is left exactly as it is.

Does it format CSS and JavaScript inside HTML?

Yes. Code inside style and script tags is formatted with the same indentation settings.

How do I minify HTML?

Paste the HTML and press Minify. Comments and whitespace between tags are removed, while Outlook conditional comments are kept.

Is my code uploaded?

No. Formatting runs entirely in your browser.