👁 Image
👁 Image
Noctis is a collection of light & dark themes with a well balanced blend of warm and cold medium contrast colors.
The theme is designed to:
- be easy on the eyes thus reducing the eye strain
- give semantic meaning to theme's colors
Noctis comes in 11 versions, 8 are dark and 3 are light.
- Noctis, Noctis Sereno & Noctis Obscuro background is a very saturated very dark cold bluish cyan
- Noctis Azureus' background is a very saturated very dark cold azure
- Noctis Bordo's background is a very unsaturated very dark warm rose
- Noctis Uva's background is a unsaturated dark cold blue. For those with more spartan taste
- Noctis Minimus' background offers a version of the Azureus palette with much lower saturation. (Thank you Draevin for your contribution)
- Noctis Viola's background is a saturated very dark cold violet
- Noctis Lux' background is a very saturated very light warm orange
- Noctis Hibernus' background is a very unsaturated very light cold bluish cyan
- Noctis Lilac's background is a very unsaturated very light cold blue
Supported Languages
I plan on adding support for new languages in the upcoming releases. Please feel free to open an issue if you'd like a new language supported or if you think something is off.
Syntax colors
The color names were matched using the excellent online tools Name that Color and Color Name & Hue
Standard Colors
| Color |
Hex Code |
Used for: |
| Eucalyptus |
👁 #49e9a6 #49e9a6 |
Strings |
| Mountain Meadow |
👁 #16b673 #16b673 |
Interpolated Strings |
| Horizon |
👁 #5b858b #5b858b |
Comments |
| Eastern Blue |
👁 #16a3b6 #16a3b6 |
Function Calls |
| Turcoise |
👁 #49d6e9 #49d6e9 |
Method Calls |
| Picton Blue |
👁 #49ace9 #49ace9 |
Code that needs to stand out |
| Cornflower Blue |
👁 #7060eb #7060eb |
Numbers & Booleans |
| Pale Violet Red |
👁 #df769b #df769b |
Keywords & Operators |
| Cinnabar |
👁 #e66533 #e66533 |
Function & Variable Declaration, Tags & this |
| Japonica |
👁 #d67e5c #d67e5c |
Object properties, ID selectors in CSS & Type annotations |
| Galliano |
👁 #d5971a #d5971a |
Attributes, Constants |
| Gold Sand |
👁 #e4b781 #e4b781 |
Variables & Parameters |
Installation
Noctis can be installed by clicking on Ctrl + Shift + X on Windows or ⇧ + ⌘ + X on Mac and then searching for "Noctis".
How to contribute
Beginning with v7.21.0 the theme building process has been simplified. I started off with the idea used in Lucy theme and came up with this theme generator powered by Node.js. This will allow me or any contributor to easily add/suggest new theme variants or changes to the existing ones. In ./src/ folder you will find:
syntax.mjs → syntax tokens based on the language grammar installed
colors.mjs → the colors used for syntax highlighting
./src/workbench/ → all eight theme versions containing Workbench/UI colors
After you make a change in any of the above files you need to use npm run build command. The build output folder is ./themes/
Happy hacking!
Contributors
Credits
This theme was inspired by the themes VS Dark, Solarized, Vue, Cobalt2, One Dark, Dracula, Pure Syntax and many others.