Building the Nova color scheme

Using an npm module to generate color schemes for multiple editors and tools from one source.


Which color scheme?

This post is about how Nova - A color scheme with meaning was built.

Project goals

I had a set of goals for the project

I especially wanted each color to have a dedicated meaning so that the color scheme was functional

Project implementation

I wanted the project to be easy to maintain, so I decided to create a source module called nova-colors that could contain all of the color values (organized by color meaning), and then use this module in the repo for each editor and tool so that they could all be updated from the same source. I did this for editors (Vim, Atom), terminal emulators (Hyper, iTerm), and other tools (Git, tmux).

Here is an example of the Nova Vim plugin; you can see how the src/ directory contains the vim-specific wire-up while using the nova-colors package for color values, and then this gets compiled.

The nice thing about having nova-colors as its own package is it can be used anywhere; for example, I'm using it on my own website as part of the style guide module.


I would recommend using a shared location for source values for things like style guides and color schemes, with a compile step - it makes using and maintaining them a lot easier ;)