Ask HN: A formula or library to generate color palettes?

https://news.ycombinator.com/item?id=35054909

by sebastiennight • 3 years ago

2 2 3 years ago

news.ycombinator.com

Use case: I'm building a feature that allows a User to ask for e.g. a "sky blue" design. From there I would have "sky blue" as the dominant color, but I need a library or "best practice formula" to generate hex codes for text, headers, bullet point icons, accent colors, etc.

I want to be able to generate a complete CSS color palette from just this one fuzzy ask. A palette is maybe 8+ colors and asking Users to pick each is just asking for trouble. (Even better if I can generate 3 palettes and let the user pick one).

Is there a great resource for this?

PaulHoule• 3 years ago

See https://www.w3schools.com/colors/colors_schemes.asp for the theory, which is easy to implement if you work in a color space like HSV. That covers hue.

You also need to consider value, which is light vs dark. Text has to be much darker or lighter than the background it is on. There is just about enough dynamic range available that you can have values in the middle of the range on which much darker or much lighter text is visible according to the web accessibility standards.

Saturation is another slider to think about you might want to use colors with a consistent saturation or you might want to use saturated/subdued to call something out or to hide something.

A method I use a lot is to take an image with colors I like and just copy them with the eye dropper tool.

I like this also

https://seaborn.pydata.org/tutorial/color_palettes.html

sebastiennight• 3 years ago

Thanks. That Seaborn reference was really interesting!

I'm looking to have it done programmatically rather than with the eye dropper. I think ML is probably the right tool for the job if fed enough examples of palettes that "work".