Color the code meaningfully, not arbitrarily
Switch branches/tags
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Type Name Latest commit message Commit time
Failed to load latest commit information.

Meaningful syntax highlighting for Atom

Example screenshot

Color your syntax not arbitrarily, but with meaningful color layers. Blue covers variables, purple types, orange flow control and operators.

Example JSON nested

Nested JSON highlighting added for free.

Full TypeScript support

For full TypeScript support, install a custom language-typescript-react grammar and add a hack to your init file:

atom.packages.onDidTriggerActivationHook "language-typescript-react:grammar-used", ->
  atom.packages.triggerActivationHook 'language-typescript:grammar-used'

Customize colors

To customize colors, add color variables to your styles file and restart Atom.

The list of all colors is in styles/colors.less. Notice they are named after their looks and not semantics, so you adjust aesthetics, but not the logic.