Theme colour math

[Beblebroks (Nicolas)]

In one of the other chats @dan provided the formular. I also use it in my sketch plugin for the default elements colors and it works 1:1 the same like when setting the color in Elements.

Elements 0.6.8 (23389)

We generate 13 colours and drop the first and last, otherwise we get a black and white on every gradient. I wouldn’t get too hung up on it; it’s just there as a means to generate gradients quickly. We’ll probably refine it further in the future. Here’s the code we currently use… and yes, we’re open to improvements import chroma from "chroma-js" rw.color = function(colorJS) { const brightness = colorJS.brightness const actualColor = chroma(colorJS.color) const lightColor…

The problem with that approach is abit with the coloring. Specially when you try to set a 100 the 50 looks aweful. I still prefer the approach I have seen here:

https://www.tints.dev/blue/3B82F6

Including the saturation and hue offset. Very good book that explains this:

Refactoring UI