HTML formatter

Input
Output

HTML Formatter

Paste HTML, from a minified page to a template, and get it back indented the way Prettier does it. The <style> and <script> blocks inside are formatted as CSS and JavaScript, and Vue components work too.

How do I use the HTML formatter?

  1. Paste HTML or a Vue component.
  2. Pick the indent and the line width.
  3. Copy the result or save it as a file.

What does the HTML formatter do?

  • Prettier 3 formatting
  • CSS and JavaScript inside the page formatted too
  • Vue single-file components
  • Line width 80, 100 or 120
  • Errors with the line and column

Frequently asked questions

Is my code uploaded?
No. The formatter runs in your browser; your code stays on your device.
Why does it take a moment the first time?
The formatter loads only when you use it, and only the parts your language needs. After that your browser keeps it.

More JSON tools

Bracely has 97 JSON tools in one page. Related ones:

Runs entirely in your browser. Nothing you paste is uploaded. Made by Saurabh Pagrut · About · Privacy policy
Last updated · Version 5.4 · Changelog
Saurabh Pagrut on GitHub · LinkedIn · X · YouTube · Instagram