Color themes
I wanted to find an objective way to compare color schemes for code and came up with the idea of plotting them like emission lines in a spectrum.
Jury is still out on whether this is helpful, truthfully these charts are somewhat hard to parse and they don’t really convey how the theme looks in practice.
Still, we can see some interesting patterns. Both catpuccin’s and dracula’s colors seem very evenly distributed across the OKHCL color space. For dracula especially… they took OKHCL, sliced it into evenly spaced slices, and added a few whiteish hues. It makes sense since they claim they have designed their color themes for “maximum legibility”.
First line is hue, second line is chroma, and thrid is lightness.
Catpuccin Mocha
Dracula
Most color themes use blueish hues for background colors, gruvbox being the odd one out.
Gruvbox Dark
Most themes have red, yellow, and green hues. Which makes sense, because there is a common design language of for example delete buttons being red. If we filter out those common hues, Gruvbux and Nord show huge gaps in their color spectrum.
As a Nord and Gruvbox enjoyer myself I quite like it when color themes are confined this way. When your programs are nord-themed, you can pick a crass orange color (like the one you see on this website) for your window manager for example and it will really pop. When your code editor renders the entire rainbow you can’t really pick a color range that you can use for something else.
Nord
VsCode Dark
And I guess it’s also interesting to see that no matter the color theme, a full UI will always need more hues than your design system provides. My vscode is absolutely loaded with color, even though I use a really muted nord theme.