Modern, elegant, clean and consistent Atom syntax theme
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
fixtures
styles
.gitignore
CHANGELOG.md
LICENSE.md
README.md
index.less
package.json

README.md

Atom Snazzy Clear Syntax

Simple, distraction-free atom syntax based on awesome hyper-snazzy

Read the reasoning behind the theme here

Features

  • Dimmed color for distracting elements like punctuations, parens, and braces
  • Extensive JavaScript with ES2015+ and JSX + Flow support
    • Differentiate between array/object destructuring and array/object literals
    • Consistent color for object property (including shorthand) and JSX props
    • Same color for template string variable and JS expression extrapolation in JSX

Color Guideline

  • Magenta for native keyword
  • Cyan for method or function
  • Blue for class and type definition
  • Bright green color for string literal for easier spotting "hardcoded" value
  • Pale bright green color for RegExp because of its relationship with string
  • Orange for constant, like number, boolean literal and UPPER_CASE variables
  • Red for HTML tags in both HTML, JSX, and CSS selector

Screenshot

JavaScript

Install language-babel for better syntax highlighting support.

Atom Snazzy Clear JS Screenshot

CSS

Atom Snazzy Clear CSS Screenshot

Acknowledgement

Thanks to Sindre Sorhus for his awesome color palette in hyper-snazzy.

License

MIT