About HTML Pretty Print

Pretty print HTML with color-coded output. Part of the DevTools Surf developer suite. Browse more tools in the HTML collection.

Use Cases

• Developers presenting HTML snippets in documentation
• Code reviewers reading formatted HTML pull requests
• Technical writers embedding syntax-highlighted HTML in tutorials
• Frontend mentors demonstrating HTML structure to students

Tips

• Use color-coded output to distinguish tags from attributes
• Toggle line numbers for easier code review discussions
• Compare before and after to verify no content was altered

Fun Facts

• Syntax highlighting was first popularized by the text editor Lexx in 1985 at IBM, initially for PL/I code.
• The HTML <blink> tag, introduced by Netscape in 1994, was never part of any W3C specification and was deprecated in 2013.
• Modern browsers can parse and render a simple HTML page in under 50 milliseconds on average hardware.

FAQ

How is pretty-print different from the HTML formatter?

Pretty-print adds syntax highlighting and lets you sort attributes alphabetically; the formatter only adjusts indentation. Use pretty-print for docs and code reviews, formatter for commits.

Can I copy the colored output?

The colors are CSS only. Copy gives you plain indented HTML that round-trips back through any parser. The color is for human readability.

Does it normalize self-closing tags?

Optional — toggle 'XHTML self-close' to force `<br/>` style, or leave off for HTML5 `<br>`. The tool defaults to matching your input.

What about doctype and comments?

Preserved. The doctype stays on its own line; comments keep their original position but are re-indented.