justyourdevHTML Formatter
Clean up messy or minified HTML in one paste.
- 100% Free
- No Sign Up
- Works in Your Browser
HTML formatter
Beautify and indent HTML
Indent
Quotes
Everything runs in your browser. Nothing is uploaded.
More Developer Tools
View all tools- JSON formatterPretty-print and indent JSON
- JSON validatorCheck JSON and find syntax errors
- JSON minifierStrip whitespace from JSON
- XML formatterIndent XML so it's readable
- SQL formatterFormat SQL queries for readability
- Base64 encode/decodeEncode and decode Base64 text
- JWT decoderDecode a JSON Web Token
- UUID generatorGenerate random v4 or time-ordered v7 UUIDs
- Timestamp converterConvert Unix epoch time to dates
Every everyday developer tool, right in your browser.
No installs. No uploads. No signup.
Browse all 36 tools- Developer tools
- 36
- Cheat sheets
- 10
- Bytes uploaded
- 0
How to use the HTML formatter
Three steps, all in your browser.
- 1
Paste your input
Type or paste your code or data. Press Sample to try an example.
- 2
Pick the style
Choose indentation or options. The result updates as you type.
- 3
Copy the result
Copy the output in one click. Nothing is saved or sent anywhere.
HTML Formatter: what to know
The HTML formatter runs Prettier, the open-source formatter used in many editors, in your browser. It indents nested elements, puts block elements on their own lines and wraps long attribute lists, turning minified or hand-mangled markup into something you can read and edit.
HTML is trickier to format than most languages because whitespace between inline elements is visible on the page: a line break between two links renders as a space. Prettier keeps that whitespace exactly as it was, which is why it sometimes breaks lines in unusual places, such as inside a closing tag. That's deliberate: the page renders the same.
Inline <script> and <style> blocks are formatted as JavaScript and CSS too. Template syntax from frameworks and server languages, such as Jinja, PHP or Handlebars, isn't plain HTML and may not format cleanly; format those in an editor with the matching plugin.
Popular uses
- Reading the HTML of an email template or CMS export
- Cleaning up markup before pasting it into a project
- Unminifying a page's source to understand its structure
- Making HTML snippets tidy for documentation
Tips for the best result
- Paste a whole document or a fragment; both work.
- If the output has an odd break like </a\n>, it's protecting whitespace; changing CSS display or removing the space in the source avoids it.
- Use the HTML minifier for the opposite job, shrinking markup for production.
Read how JustYourDev works and our privacy details. Code, data and files you use here are processed in your browser and are never sent to our server.