The best Atom packages and themes.

Atom text editor packages and themes to make your coding more efficient.

Danny Paton


For more web dev content follow me on Twitter!


Takes your spaghetti code, fixes the syntax and makes everything look gorgeous!
To use: Press ctrl+alt+b in any open file (.html, .css, .scss, .js, etc).

Greatly improves HTML & CSS workflow. Comes with lots of shortcuts and allows you to create snippets for your own custom shortcuts.

A colour picker right in the editor. No need for an app.
To use: press cmd+shift+c to open it.

A whole bunch of great snippets while writing jQuery.
To use: Start typing jQuery code and options will appear as your type. Press tab to select the snippet you want to use.

Synchronize package settings, keymap and installed packages through GitHub. A bit trickier to setup but definitely worth it to have the same setup between computers.
To use: Setup the correct Personal Access Token, Gist Id and Analytics through the instructions. In Atom press cmd+shift+p then type sync-settings:backup to backup your files or type sync-restore to restore them on a different computer.

To use: Press cmd+shift+p then type clipboard-plus:toggle and your copied history will show in a scrollable list.

Keep your Atom packages up to date. Reload Atom for enable changes.

Pigments will scan source files in your project directories looking for colours and will build a palette with all of them.

Assign file extension icons and colours for improved visuals.


UI Theme — Atom Dark
Installing this theme will make your sidebar and general colours in Atom…