[Sharing] OKLab: color palette generator and better gradients
Hey,
In my journey of exploring procedurally generated color palettes and color spaces, I stumbled upon OKLab, which is an "ok lab color space". It's basically designed to be "easy to use" and to be consistent in terms of humanly perceived chroma, hue and lightness (which RGB and HSL aren't). It apparently performs "ok" for this purpose and some people even write fancy articles to say it's among the best color spaces for that purpose.
As I did previously for cubehelix, I decided to port OKLab code to jit.gen for a better Max integration. It comes in two flavours, the first one is inspired by my previous work and acerola's palette generator (awesome explanation video here), and it's very good at... generating "consistent" color palettes.
The second one is based on that shadertoy and its aim is to create color gradients between two colors. You'll see that blending two colors in the OKLab color space feels much more "natural" than what we usually do in the sRGB space.
For now here is the demo patch.
I might keep working on it later to make a [jit.oklab] abstraction as I did for cubehelix.
I will also try to post some "real world" examples of how to uses these palettes, soon.
Hope you like it!
Nice! Thanks for sharing!
I've recently been playing around with some color palette work using HCL and the chroma.js package via node.script (similar to OKLCH, a polar representation of OKLab).
Here's a little patch that does some palette generation. Sorry not super well documented, but might be of interest.
thanks to you both for sharing these awesome tools!
For anyone unfamiliar with node.script, send the message script npm install chroma-js to the node.script object in Joshua's patch to install the dependency.
Thanks Joshua for sharing this! A different approach, interesting to see. First time I actually use n4m (although I'm familiar with node for webdev). Did you have a specific use case in mind or is it more of a multipurpose palette engine inspired by color.adobe.com?
I feel like using n4m for color palette generation is a bit overkill for me, especially with such an extended chroma.js API, but at least most of the work is already done, and you've access to more than needed in terms of color manipulation. It even does cubehelix! (I invite you to see my previous thread on this topic).
My pleasure! And cool cubehelix tools!
Mostly I've been using it for some UI experiments and exploration. And yes, this patch was simply playing around with some of the types of things that color.adobe.com does (albeit, not quite the same). For lighter weight needs, I've ported small parts of chroma.js for use in the standard JS object, which isn't terribly difficult to do if you know what pieces you need, and could be ported to jit.gen/pix/etc.