Mac OS and
Travis CI:	AppVeyor:

Beautify HTML, CSS, JavaScript, PHP, Python, Ruby, Java, C, C++, C#, Objective-C, CoffeeScript, TypeScript, Coldfusion, SQL, and more in Atom

Before	After
Original HTML	Beautified HTML

• Installation
• Beautifiers
• Language Support
• Usage
  • Command Palette
    • Beautify a Specific Language
  • Selection of Code
  • Beautify On Save
  • Keyboard Shortcut
    • Custom Keyboard Shortcuts
• Configuration
  • Simple
  • Nested
• Troubleshooting
• Contributing

Atom Package: https://atom.io/packages/atom-beautify

apm install atom-beautify

Or Settings/Preferences ➔ Packages ➔ Search for atom-beautify

Atom-Beautify respects the core.telemetryConsent configuration option from Atom editor. If you do not wish to have usage data sent to Google Analytics then please set core.telemetryConsent to no or undecided option before using Atom-Beautify. See Anonymous Analytics section of docs for details. Thank you.

On Atom Load	Change Setting Later

Atom-Beautify is going to be completely rewritten with Unibeautify at its core! See unibeautify branch for work in progress and Issue #1174.

Some of the supported beautifiers are developed for Node.js and are automatically installed when Atom-Beautify is installed. However, other beautifiers are command-line interface (CLI) applications and require you to manually install them.

See all supported options in the documentation at docs/options.md.

Open the Command Palette, type Beautify, and run Beautify Editor.

You can use the Command Palette to beautify the editor for a specific language. The commands are in the form Atom Beautify: Beautify Language {NAME} (i.e. atom-beautify:beautify-language-{NAME} for keyboard shortcuts). For example, you may want to beautify JavaScript code within a HTML file.

It will only beautify selected text if a selection is found -- if not, the whole file will be beautified.

Selection of Code	Beautify Selection of Code	Beautify Entire File
Select code in Atom editor	Only that selection is beautified	Without a selection all code is beautified

Beautify On Save can be enabled for each language individually.

For example, for language HTML go into Atom-Beautify's package settings (Atom ➔ Preferences ➔ Search for atom-beautify), find HTML, and toggle the Beautify On Save option.

You can also type Ctrl-Alt-B as a shortcut or click Packages > Beautify in the menu.

See Keymaps In-Depth for more details.

For example:

'.editor':
  'ctrl-alt-b': 'atom-beautify:beautify-editor'

Edit your .jsbeautifyrc file in any of the following locations:

• Atom Package Settings Atom ➔ Preferences ➔ Search for atom-beautify
• Same directory as current file
• Project root atom-beautify will recursively look up from the current file's directory to find .jsbeautifyrc.
• Your user's home directory

Note: Comments are supported in .jsbeautifyrc thanks to strip-json-comments.

See examples of both ways inside examples/

See all supported options in the documentation at docs/options.md.

See examples/simple-jsbeautifyrc/.jsbeautifyrc.

{
  "indent_size": 2,
  "indent_char": " ",
  "other": " ",
  "indent_level": 0,
  "indent_with_tabs": false,
  "preserve_newlines": true,
  "max_preserve_newlines": 2,
  "jslint_happy": true,
  "indent_handlebars": true
}

See examples/nested-jsbeautifyrc/.jsbeautifyrc.

{
  "html": {
    "brace_style": "collapse",
    "indent_char": " ",
    "indent_scripts": "normal",
    "indent_size": 6,
    "max_preserve_newlines": 1,
    "preserve_newlines": true,
    "unformatted": ["a", "sub", "sup", "b", "i", "u"],
    "wrap_line_length": 0
  },
  "css": {
    "indent_char": " ",
    "indent_size": 4
  },
  "js": {
    "indent_size": 2,
    "indent_char": " ",
    "indent_level": 0,
    "indent_with_tabs": false,
    "preserve_newlines": true,
    "max_preserve_newlines": 2,
    "jslint_happy": true
  },
  "sql": {
    "indent_size": 4,
    "indent_char": " ",
    "indent_level": 0,
    "indent_with_tabs": false
  }
}

See docs/troubleshooting.md.

See all contributors on GitHub.

Please update the CHANGELOG.md, add yourself as a contributor to the package.json, and submit a Pull Request on GitHub.

MIT © Glavin Wiechert