There are so many tools out there to help you pick colors. I totally get it! It’s hard! When colors are done well, it’s like magic. It adds a level of polish to a design that can really set it apart.

Let’s look at some, then talk about this idea some more.

Here’s one I just saw called Color Koala:

It spits out five colors at ya and you’re off to the races.

Hue will give you some too.

hue Re: Pleasing Color Palettes design tips

There’s a billion more, and they vary in approach and features, of course. Here’s a handful:

Then there are tools that focus on gradients, like UI Gradients, Web Gradients, and Shapy.

gradients Re: Pleasing Color Palettes design tips

Oh! And a site that helps with text color while keeping accessibility in mind.

a11ytext Re: Pleasing Color Palettes design tips

There are even native apps like Sip, ColorSnapper, and Frank DeLoupe that help you select colors and sometimes keep your palettes right within them.

cp-in-sip Re: Pleasing Color Palettes design tips

Colors can be programatically generated.

There is no native JavaScript API for it, but it’s still basically a one-liner:

See the Pen Generate New Random Hex Color with JavaScript by Chris Coyier (@chriscoyier) on CodePen.

Pleasing colors can be as well.

Generating random colors won’t guarantee pleasing palettes, especially if a bunch of random colors are paired together. PleaseJS can help build color schemes that work together. You provide it a base color and other options (like what type of color scheme) and it spits out colors for you.

See the Pen Generate Pleasing Colors by Chris Coyier (@chriscoyier) on CodePen.

Similarly, randomColor.js

gen­er­ates at­trac­tive col­ors by de­fault. More specif­i­cally, ran­dom­Color pro­duces bright col­ors with a rea­son­ably high sat­u­ra­tion. This makes ran­dom­Color par­tic­u­larly use­ful for data vi­su­al­iza­tions and gen­er­a­tive art.

It doesn’t claim to make multiple colors part of a cohesive theme aside from passing in a base hue or luminosity.

See the Pen Generate Pleasing Colors by Chris Coyier (@chriscoyier) on CodePen.

But the thing about just being handed colors is…

…they don’t exactly tell you how to use them. Steve Schoger makes a point of this, rather hilariously in a blog post. This is a perfectly lovely color palette:

whats-in-a-color-palette-01 Re: Pleasing Color Palettes design tips

But if you just pick those colors and plop them onto a design, you could end up with something like this:

whats-in-a-color-palette-02 Re: Pleasing Color Palettes design tips

You might like that, but you’d be in the minority. It’s not a refined design that gets out of the way and would be nice to use every day. Color usage is a bit more complicated than plopping five nice colors into a design. It’s variations on those and using them in tasteful ways, like this:

whats-in-a-color-palette-03 Re: Pleasing Color Palettes design tips

Picking up Steve Schoger and Adam Wathan’s book surely has some advice for you there!

The post Re: Pleasing Color Palettes appeared first on CSS-Tricks.