Version 0.1.0
We define a set of colour codes organized into shades ranging from dark to light. These codes are commonly used in software development and design for creating themes or styling user interfaces.
We provide a mapping between Base24 and Base16 colour codes for reference:
| Base24 | Base16 |
|---|---|
| base10 | base00 |
| base11 | base00 |
| base12 | base08 |
| base13 | base0A |
| base14 | base0B |
| base15 | base0C |
| base16 | base0D |
| base17 | base0E |
We offer guidelines for both dark and light themes:
-
Dark Theme:
- Colours from base00 to base07 should range from dark to light.
- Colours base10 to base11 should span from light to dark, but still darker than base00.
-
Light Theme:
- Colours from base00 to base07 should range from light to dark.
- Colours base10 to base11 should span from dark to light, but lighter than base00.
Each colour (baseNN) serves a specific purpose or use case, such as background, foreground, variables, etc. Here's a breakdown:
| Colour | BaseNN | Ansi | Terminal/Colour Use | Text Editor |
|---|---|---|---|---|
| base00 | - | Background | Default Background | |
| base01 | 0 | Black | Lighter Background (Used for status bars) | |
| base02 | 8 | Bright Black | Selection Background | |
| base03 | - | (Grey) | Comments, Invisibles, Line Highlighting | |
| base04 | - | (Light Grey) | Dark Foreground (Used for status bars) | |
| base05 | - | Foreground | Default Foreground, Caret, Delimiters, Operators | |
| base06 | 7 | White | Light Foreground (Not often used) | |
| base07 | 15 | Bright White | The Lightest Foreground (Not often used) | |
| base08 | 1 | Red | Variables, XML Tags, Markup Link Text, Markup Lists, Diff Deleted | |
| base09 | ~3 | (Orange) | Integers, Boolean, Constants, XML Attributes, Markup Link Url | |
| base0A | 3 | Yellow | Classes, Markup Bold, Search Text Background | |
| base0B | 2 | Green | Strings, Inherited Class, Markup Code, Diff Inserted | |
| base0C | 6 | Cyan | Support, Regular Expressions, Escape Characters, Markup Quotes | |
| base0D | 4 | Blue | Functions, Methods, Attribute IDs, Headings | |
| base0E | 5 | Purple | Keywords, Storage, Selector, Markup Italic, Diff Changed | |
| base0F | - | (Dark Red or Brown) | Deprecated Highlighting for Methods and Functions, Opening/Closing Embedded Language Tags, e.g., <?php ?> |
|
| base10 | - | (Darker Black) | Darker Background | |
| base11 | - | (Darkest Black) | The Darkest Background | |
| base12 | 9 | Bright Red | NA | |
| base13 | 11 | Bright Yellow | NA | |
| base14 | 10 | Bright Green | NA | |
| base15 | 14 | Bright Cyan | NA | |
| base16 | 12 | Bright Blue | NA | |
| base17 | 13 | Bright Purple | NA |
Note: Items in parenthesis for the Terminal/Colour Use do not have an identified terminal use and are a more generic colour description. Implementation may vary depending on the Base24 scheme.
Note: Bright colors can have a higher luminosity relative to its
non-bright counterpart. Conventionally, the luminosity can be determined by
looking at the L value in the HSL color space (for the best accuracy,
OKHSL/OKHSV is recommended).
Bright colors can also have increased saturation for stronger emphasis, but this
is not a hard requirement.
