HTML Beautifier
Turn a single line of minified HTML into readable, indented code you can study and edit.
- Indent & wrap options
- CSS & JS inside
- Unclosed-tag warnings
- Live preview
What does an HTML beautifier do?
Minified HTML strips line breaks and indentation to save bytes, which makes it almost impossible to read. An HTML beautifier (or prettifier) adds that structure back: nested elements are indented, block elements start on new lines and long lines wrap. This beautifier also prettifies embedded CSS and JavaScript, keeps preformatted text untouched and lets you choose tabs or spaces and how attributes wrap.
How to beautify HTML
- Paste your HTML or choose Open File.
- Pick the indent (2 spaces, 4 spaces or tabs), line wrap and how attributes wrap.
- Read the formatted code on the right and check any tag warnings below.
- Copy the result or download it as an .html file.
Formatting tips
- Inline elements such as <a>, <b> and <span> stay on the same line as their text.
- Choose “One per line” attributes for components with many props.
- Turn off “Format CSS & JS” to leave script and style blocks exactly as they are.
- Compare two versions with the text diff tool after formatting both.
Why use this html beautifier
- Readable in one pasteFormats as you type with sensible defaults; no button to press.
- Spots broken tagsWarns about unclosed and mismatched tags with line numbers.
- Live sandboxed previewSee the rendered page next to the code, with scripts disabled for safety.
- Code never leaves your deviceFormatting runs in your browser, so internal templates, emails and client pages are never uploaded.
Common uses
- Minified pages. Read the source of a production page.
- Email templates. Untangle nested table layouts.
- CMS and builder output. Clean up HTML from WordPress, Webflow or page builders.
- Code review. Normalise indentation before comparing versions.
Working with other formats? Try the XML formatter, JSON formatter and SQL formatter, convert HTML to Markdown, or compare versions with the diff checker.
Example: unminify a page
Paste the page source from View Source. Choose 2 spaces and wrap at 120. The beautified version shows the head, body and each section indented, with the inline CSS expanded.
What to expect from the result
Formatting changes whitespace only between elements; it does not fix invalid HTML. Template syntax (Handlebars, Jinja, Liquid, Vue) is usually preserved, but very complex templates may need checking. Files up to 10 MB.
HTML Beautifier questions
What is the difference between beautify and format?
They mean the same thing: adding consistent indentation and line breaks to code.
Can I unminify HTML?
Yes. Paste the minified HTML and the beautified version appears instantly.
Can it format CSS and JavaScript inside HTML?
Yes. Style and script blocks are formatted with the matching CSS and JavaScript beautifiers. Untick “Format CSS & JS” to keep them as they are.
Does formatting change how my page looks?
Normally no. Whitespace between block elements does not render. Contents of pre and textarea are never changed.
Is my HTML uploaded?
No. Formatting runs in your browser and nothing is sent to a server.