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! https://twitter.com/dannypaton_

Packages

atom-beautify
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).

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

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

jquery-snippets
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.

sync-settings
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.

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

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

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

file-icons
Assign file extension icons and colours for improved visuals.

Themes

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

--

--