I've already spent about 2 hours searching google and trying various tools but either they don't do indent tags per say or they aren't HTML5 compatible such as the famous HTML tidy which was last updated 3 years ago…

N.B. I don't want to apply this to the source of a page (like PHP or JS would do) but to the code in the editor so that a clear hierarchy appears between tags.

Ideally I'd like a Mac OS X tool but I'll take any online tool and in last resot a Wine compatible one.

P.S. at the moment I use Coda from Panic

  • 2
    Netbeans supports code-formatting via SHIFT+ALT+F, most editors have a similar function – check the manual of one you use. See also: groups.google.com/group/coda-users/browse_thread/thread/…
    – feeela
    Sep 16, 2011 at 9:36
  • Netbeans does it (thx) but not Coda as your link shows. Sep 16, 2011 at 10:03
  • But there are two other programs mentioned in the linked discussion that do…
    – feeela
    Sep 16, 2011 at 10:17
  • I imagine if you look you will find a Coda extension that adds support for HTML5 elements.
    – Moses
    Sep 16, 2011 at 17:56

8 Answers 8


Aptana Studio 2 does what you want in the menu Edit > Format. I've used it and it formats html, css and javascript.

The WYSIWYG editor BlueGriffon also can also format html when you open a file.

Both solutions are free and open-source, but Aptana might be better. I'm not sure if BG keeps all the code unchanged, probably not.


  1. Aptana 2 needs to be properly configured after you install it, but it's a great html5/css/javascript editor/IDE. The default config sucks a little.
  2. Aptana 3 might not do what you want. The version I've tried didn't do it.
  • Personally, I dislike it for the Eclipsish IDE (I don't like Eclipse :P).
    – Alerty
    Oct 13, 2011 at 1:11
  • Aptana is a great program for html/css/js, keeping track of opening and closing bracket or braces in javascript in really large functions is a pain in dreamweaver.
    – Anagio
    Mar 20, 2012 at 14:05
  • Thank you this has just saved my life after moving my project files from another IDE to Aptana and the indentation getting messed up. I was manually re-indenting all my thousands upon thousands of lines. In Aptana 3 this is under the Source menu > Format.
    – bowlerae
    Jul 12, 2019 at 3:19

There's now an HTML5 version of tidy, found here: https://github.com/w3c/tidy-html5.


I was looking for an online tool and that's probably why I failed to find anything.
I was pointed to the Coda plugin PHP & Toolkit that does it. Also most HTML editors like Taco do it natively (but not Coda).


I humbly suggest Espresso 2.

From their website:

The one and only CSSEdit 3 — CSSEdit's award-winning visual tools, now inside Espresso. With awesome CSS3 support for multi-browser gradients, shadows and more.

Web Preview with X-ray — See how your CSS affects web layouts, visualize margins and padding, and quickly find the relevant style rules for any page element.

Powerful and Efficient Coding — CodeSense, code folding, smart snippets, Zen coding and the drag-and-drop Navigator help you write better code in less time.

Live Styling and Overrides — Edit any website's CSS and see it update in real-time. No need to save, publish or reload. Experimenting and tweaking has never been this fun.

Effortless Sync and Publishing — With Quick Publish, Server Sync and Browse, you have the right tool for any server-based workflow. The new Vroom engine is super-fast.

A Workspace That Fits Into Your Workflow — The innovative Workspace gives you the flexibility of Tabs while integrating smoothly with your Project files.

Fantastic Find — Needle and haystack, meet Espresso. Project-wide Find and Replace, Quick Filter and colorized regex make searching through files or text a breeze.

Language Support — Improved HTML5, CSS3, JavaScript and PHP; all-new Ruby, Python, Apache and Markdown. Or extend Espresso with XML/JS Sugars.

You could read a review from Mac Appstorm to have an idea of the quality. They give it 10/10.


Eclipse seems to do a decent job of indenting/formatting HTML5. You just use the usual format command (Ctrl-Shift-F) on an HTML file loaded in the HMTL editor and it will reformat it.

To adjust it, go to preferences --> web --> html files --> editor. You can also control validation here. (I'm using Eclipse v4.2.2.)

Note that the HTML editor requires that your Eclipse installation include the Web Tools Platform (see this answer for details).


If you're looking for a Mac OS X tool that does the job, I'd say TextMate.

I usually do a lot of re-indenting and the best one that I've been able to find has been that one.

What I like is that it doesn't actually rearranges your code, but it re-indents it, in a form that checks the nesting and indents by level, not by tags.

The "Indent Selection" feature is specially useful.

  • I use textmate, when did they introduce a good formatting action for HTML? Please share as all the ones I've found have been pretty bad. Though I am still using 1.5. Mar 4, 2014 at 16:22

JetBrains PhpStorm works great and intuitive with indents in HTML, CSS or PHP. Type of indent (tabs or spaces) you can change in PHPStorm settings.


Dirtymarkup.com is my go to for quickly formatting HTML and JS.

Not the answer you're looking for? Browse other questions tagged or ask your own question.