HTML Viewer
Preview HTML live in a secure sandbox with mobile and tablet widths. Scripts and network access are off by default.
HTML Formatter & Beautifier
Beautify, minify, and check HTML online. Free, instant, and 100% in your browser.
Input HTML
Output
Formatted HTML will appear here.
What is an HTML Formatter?
An HTML formatter, or HTML beautifier, rewrites markup with consistent indentation so the structure of a page is easy to read. It is useful for minified HTML, generated templates, email markup, and code copied from browser developer tools.
Unlike a simple re-indenter, this formatter reads HTML the way browsers do. It only changes whitespace where browsers ignore it, and it reports markup problems that browsers would silently repair.
Features
Safe formatting
Whitespace inside text and inline elements is kept, so the page looks exactly the same after formatting.
Finds hidden problems
Unclosed tags, stray closing tags, misnested elements, duplicate attributes, and <div/> are reported with line and column.
Reads HTML like a browser
Optional end tags (</li>, </p>, </td>), void elements, and raw text in <script> and <style> are handled the way browsers do.
Code stays untouched
The contents of <pre>, <textarea>, <script>, and <style> are kept exactly as written.
Beautify and minify
Indent with 2, 3, or 4 spaces or tabs, or minify by removing whitespace that browsers ignore.
Private by design
Everything runs locally in your browser. Your HTML is never uploaded.
HTML Formatting Example
<ul><li>Home<li>About <b>us</b></ul><div class="card"/><p>Hi, <span>friend!</div><ul>
<li>Home</li>
<li>About <b>us</b></li>
</ul>
<div class="card">
<p>Hi, <span>friend!</span></p>
</div>
The omitted </li> and </p> tags are added, and the structure matches what browsers build. The formatter also reports the mistakes that browsers silently repair:
- Line 1, column 37: <div/> is not self-closing in HTML. Browsers treat it as an opening tag, so add </div>.
- Line 1, column 63: <span> is not closed before </div>.
How to Format HTML Online
- Paste your HTML into the Input editor, or upload or drop an .html file.
- Choose Beautify or Minify, and pick your preferred indentation.
- Review any reported issues and click a line number to jump to it.
- Copy the result to your clipboard or download it as a file.
Frequently Asked Questions
Will formatting change how my page looks?
No. Line breaks and indentation are only added where browsers ignore whitespace, such as between block elements. Text and inline elements like <a>, <b>, and <span> keep their spacing, and <pre>, <textarea>, <script>, and <style> are left exactly as they are.
Why does the formatter add closing tags like </li> and </p>?
HTML allows these end tags to be omitted, and browsers add them automatically. The formatter writes them out so the structure is explicit. The page renders the same.
What do the issues mean?
Browsers never refuse to show HTML. Instead they silently repair mistakes, which can produce a different structure than you intended. Each issue shows a repair the browser makes, such as closing an unclosed <div>, so you can fix the markup yourself.
Why is <div/> reported as an issue?
In HTML, only void elements like <br> and <img> can be self-closing. Browsers ignore the slash in <div/> and treat it as an opening tag, so everything after it ends up inside the div. Write <div></div> instead.
Does it validate HTML against the W3C standard?
It checks the document structure: tags, nesting, and attributes. It does not check every rule of the HTML specification, such as which attributes are allowed on each element.
Is my HTML uploaded anywhere?
No. Parsing and formatting run entirely in your browser. Your HTML never leaves your device.
Related Tools
JSON Formatter
Beautify, minify, and validate JSON instantly with exact line and column error reporting.
JSON Comparer
Compare two JSON documents side by side and see every added, removed, and changed value.
JSON to XML
Convert JSON to well-formed XML with custom root and item names, attributes, and indentation.