Chandrian is a semantic syntax highlighting theme, designed to make scanning large code-bases easier and to highlight errors your linter doesn't catch. It features a 16-color palette of carefully chosen warm, cold, and neutral colors.
Warm Colors are used for action keywords - throw, return in programming languages, links in Markdown files.
Cold colors are used for definitions - Function names, variable values etc.
Muted neutral colors are used for punctuation, comments, and anything else which detracts from the code.
All colors have a contrast ratio of at least 4.5:1 and meet the criteria for "AA" accessibility level defined by the Web Content Accessibility Guidelines (WCAG).
The rules for programming languages were chosen to facilitate cognitive parsing of large blocks of code.
Exit keywords (return/throw) and control keywords (if, for etc.) are assigned complementary warm colors bright enough to immediately catch your eye on a quick scan through.
Function definitions / functional calls / property names are assigned complementary cold colors.
Semi-colons, curly-braces etc are important for the compiler but are just visual noise for humans, and are hence muted.
Comments are important and helpful, but secondary to the actual code and are also muted.
'function', 'var', 'const' and other language keywords also toned down.
Variable declarations are brighter than regular variables. I'm on the fence about if this helps or distracts (opinions welcome on Github issues); see notes below for instructions on turning this off.
= is assigned a contrasting color to == so you can immediately catch if typo one for the other.
These rules should apply to most languages but were specifically designed for JS/Typescript. If something looks in a specific language, issues/ PRs are welcome.
The following rules apply to HTML documents.
Different element types (block elements/ inline elements/ input elements) are assigned different colors.
Classes are the most commonly used attribute and are shown visually more prominent than others.
href, form action attribute values, and inline event handlers are treated as action triggers and assigned brighter 'warm' colors.
data- attributes are highlighted.
Un-recognized tags show up as errors. Lifesaver if you chronically mistype 'form' as 'from' as I do.
Other highlighted errors include Ambersands which should be escaped, redundant trailing > etc.