🏠 back to Observable

Flow-o-Matic brighter nodes

https://next.observablehq.com/@brunurb/flow-o-matic-sankey-silvia

In the above sankey diagram I wanted the nodes colours to appear brighter than the links colour it worked for the other colours that I am using except the blue colour, could someone give me a clue how to make the blue nodes colour get brighter

Noob here
Thanks in advance for your replies.

As you can see in the screenshot below, calling brighter on RGB blue (0, 0, 255) just makes the blue channel even higher — but it can’t go higher than 255, so it comes out the same.

If you use HSL (which is as easy as adding .formatHsl()), it comes out more consistently. (The docs for brighter note that “The behavior of this method is dependent on the implementing color space.”)

Edit: Here’s the tweak in a notebook suggestion you can merge.

To my eye, the blue still doesn’t appear as much brighter as the green does — but at that point you’re in the wild world of color perception, hah. There’s great wild research on perceptually uniform rainbows, and great tools for generating color palettes; I get easily overwhelmed by the topic, and I don’t know how much it bothers you. I don’t know how you picked these colors (and maybe you’ve already tried this), but some of these scales may offer more consistent brightness.

2 Likes

Thanks tophtucker it worked, and also thank you for the additional info, very informative and well explained.

All the best to you.
Bruno

1 Like