Skip to content
Mediawand

HTML Formatter and Beautifier

Make minified or tangled HTML readable again. Every element goes on its own line at the right depth, and the CSS and JavaScript inside the page are tidied as well.

How to format HTML

  1. 1Paste your HTML or open an .html file.
  2. 2Choose the indent and how attributes are laid out.
  3. 3Copy the formatted HTML or download it.

Scripts and styles too

Code inside <script> and <style> tags is formatted along with the markup, so a whole page comes out readable.

Attributes

Keep attributes on the tag's line, or put each on its own line, which makes long tags with many classes or data attributes easier to scan and to compare in a diff.

Text stays put

Text inside <pre> and <textarea> is left exactly as it is, since spacing there is visible on the page.

Frequently asked questions

Is my code uploaded?
No. Everything runs in your browser, so your code never leaves your device.
Can it fix broken HTML?
It formats whatever you give it, but it doesn't add missing closing tags. Unclosed tags show up as indentation that never steps back.
Does formatting change how the page looks?
Almost never. Extra line breaks between inline elements can add a space in rare cases, such as between two images.

Related tools

Loading tools…