HTML Formatter & Beautifier

Clean up messy or minified HTML with proper indentation and readable structure.

📐 How to Use

  1. Paste your HTML into the input box.
  2. Click "Format" to apply clean indentation.
  3. Click "Minify" to collapse it back to a single compact line.
  4. Copy the result.

🎯 When to Use This

  • Making sense of a page's view-source when the server ships everything on one line and you are hunting an unclosed section.
  • Cleaning up markup pasted out of a WYSIWYG editor or an email template before it is committed to a repository.
  • Preparing two generated templates for a side-by-side diff, where consistent indentation is the thing that makes the diff readable.
  • Walking a junior colleague through an unfamiliar page's structure, where nesting depth is far easier to see once it is indented.

❓ Frequently Asked Questions

QDoes this fix broken HTML?
It reformats valid or near-valid HTML for readability. It does not fix structurally broken markup like unclosed tags — use the browser's own error-correcting parser for malformed input.
QWill it preserve my inline scripts and styles?
Yes — content inside <script> and <style> tags is preserved as-is and not reformatted internally.
QIs my HTML sent anywhere?
No — formatting happens entirely in your browser using JavaScript string processing.

ℹ️ About This Tool

Indenting HTML is not always safe. A browser collapses a run of whitespace between two inline elements into one rendered space, so splitting them across lines keeps that gap while joining them removes it. Between block-level elements the same whitespace is discarded and the indentation costs nothing. Inside pre and textarea every character counts. A formatter that does not make these distinctions will change how a page looks while claiming only to have tidied it.

This tool lifts script and style blocks out first so their contents are not reflowed, removes the whitespace sitting between tags, then walks the remaining tags and emits two spaces of indentation per level of nesting. The fourteen void elements, img and br among them, are recognized so they do not open a level that never closes. Script and style are put back with each of their lines trimmed.

⚠️ Notes & Limits

  • Whitespace between tags is removed before indenting, so the single rendered space between two adjacent inline elements disappears and words can run together.
  • The contents of pre and textarea are reflowed like anything else, so format those by hand or the preserved whitespace they exist for is gone.
  • Attributes pass through as one unbroken string, so a tag carrying many attributes stays on a single long line however wide it becomes.
  • A PHP or template tag containing a greater-than character inside it, such as an inline comparison, is split by the tokenizer and emitted as two pieces.