Show HN: An OKLCH-based perceptually uniform color system/theme builder

colorphreak.com

5 points by kurainox 6 hours ago

I've been using a version of this internally for a few months but decided to polish it a little to finally deploy it.

It's a color system generator that creates accessible, perceptually uniform color palettes using the OKLCH space. It takes one seed (primary) color, generates relative key colors from multiple color harmony schemes (analogous, complementary, etc) that are then used to create 26-step color ramps each. Shades from the ramps are then used to generate semantic color roles, or can be used for creating custom palettes.

All colors are gamut-mapped to the sRGB gamut with chroma reduction, essentially preserving lightness and hue values while finding the maximum in-gamut chroma for each step.

There are obvious similarities to Material Design Themes, mostly because I'm visually pretty comfortable with it. Plus, I started this project back when some of the colors generated by Material could be a little dull and I wanted to learn/build something like this from the ground up.

There are a couple of improvements I would like to make to this in the near future. The first one is a dynamic chroma curve (the chroma falloffs for the ramps are on a bell curve). At the moment, the chroma curve peaks at L ~0.55 for all hue ranges, which works good enough but isn't ideal for a few reasons. The second one would be adding seed color extraction from images. And maybe a built-in contrast checker.

If you find the tool helpful and/or have any feedback or suggestions, let me know.

slig 4 hours ago

Thank you for sharing!

I have a suggestion: consider exporting for shadcn as well.