←back to thread

681 points NetOpWibby | 1 comments | | HN request time: 0.211s | source

Hey everyone,

About a year ago I embarked on creating a color scheme for a project and I loved it so much I began using it for everything. I decided to make an official repo for it to share with the world.

Anyhoo, hope y'all enjoy it.

Show context
dcchambers ◴[] No.43074937[source]
I'm confused by the usage of the word color scheme.

To me a color scheme is something like monokai. A small number of colors that go well together. The application (eg syntax highlighting in a code editor) is obvious and easy. This is just...lots of monochrome colors? How would I use this? Not trying to be dismissive, I'm just confused.

replies(5): >>43075170 #>>43077407 #>>43079850 #>>43080346 #>>43081091 #
culi ◴[] No.43080346[source]
Yeah imo they should've used "color palette". Similar to:

Open Color from OpenProps https://yeun.github.io/open-color/

Tailwind's color palette https://tailwindcss.com/docs/colors

As far as design goes, color palettes can be extremely difficult to choose while maintaining good scores on color contrast and other accessibility measures. A standardized palette is useful because it does all that work for you. Having these 3 options to choose from is pretty nice since I often reach for OC or TW palettes but often find them lacking in hues I want.

replies(1): >>43080497 #
1. seanwilson ◴[] No.43080497[source]
> As far as design goes, color palettes can be extremely difficult to choose while maintaining good scores on color contrast and other accessibility measures. A standardized palette is useful because it does all that work for you. Having these 3 options to choose from is pretty nice since I often reach for OC or TW palettes but often find them lacking in hues I want.

I think it's easier than it looks with the right tooling. You could try my UI color palette creator (you can can customise every shade, so it's not a generator as such):

https://www.inclusivecolors.com/

It checks the contrast values against a live UI mockup so you get help knowing the contrast scores are good, and what the colors look like together.

I thought the same before, but feel with the right tooling like this, color palette design goes from extremely difficult (e.g. bouncing between multiple tools manually checking contrast between pairs and if colors look good to together) to much more manageable.

E.g. if you mostly want Tailwind but with a few different hues, you can try loading Tailwind from the "Example" menu, shift some of the hue curves, then tweak the saturation curves, and it'll have the same WCAG contrast guarantees (because it's using a "perceptually uniform" color space).

I use this tool myself for making custom branded palettes for projects, rather than picking from Tailwind colors that are seen often now.