4 ms·

> What we are seeing more of with flat design and color though is the matching of tone and saturation. As someone with practically no design skills, how would

> What we are seeing more of with flat design and color though is the matching of tone and saturation. As someone with practically no design skills, how would I accomplish this? For example, let's say I had two or three colors in mind or already picked out. What are the steps I could take to line up their tones and saturation? Is there a formula or algorithm that applies? I realize design skills are developed through practice, but I very often find myself with something I've put together that looks just OK and just sort of aimlessly tinkering around with it until I've inevitably made it look washed out. So obviously my feel isn't working yet--where else can I turn?

ahknight 13y ago
Open up any color palette tool and switch to HSB mode. Move H around and leave S & B alone.
- msutherl 13y ago
  No! Hue does not vary independently from perceived saturation and brightness in the HSB color space. You would need to use something like the Munsell system to achieve this.
nlh 13y ago
Agreeing with the other reply here, and I'll expand on it a bit. When I just did a big redesign of my company's website, I spent probably far too much time playing with the color palette to get it "just so". I'm not a pro designer btw, but I wanted to get this as right as possible as early as possible so I had a good, well, palette :) to work with. Agreed that one of the discoveries I made is that HSB feel like the more "technical" way to design a color palette, and it felt more right from an engineering perspective. You define your colors as pure hues -- that's a top-level decision ("I want my colors for this project to be black, gray, yellow and white"). Those are your base H values. Saturation and Brightness are then your derivatives on the base colors -- lighter in some places, darker in others. This is all self-taught, so my color theory could be way off here, but I also found that you can generate fairly pleasing schemes through regular intervals along the spectrum. Pick a hue, for example, and then look at variations in saturation in steps of 10, 20, 30, etc. It's not an exact harmonic scale (or is it?) but that was enough to give me a good base. Check out the app "Spectrum" if you have a Mac -- I played with a bunch if similar apps and really loved this one the most -- still use it all the time for color exploring: http://www.macupdate.com/app/mac/43784/spectrum http://www.macupdate.com/app/mac/43784/spectrum
fpp 13y ago
Try Kuler by Adobe (free) https://kuler.adobe.com/ https://kuler.adobe.com/
bchar 13y ago
I use Color Scheme Designer: http://colorschemedesigner.com/ http://colorschemedesigner.com/
- msutherl 13y ago
  This app is great, especially if you don't take its recommendations verbatim. I haven't seen anything else that comes close.
katherineparker 13y ago
Another option for getting a web color scheme: http://webcolourdata.com/ http://webcolourdata.com/ It shows a color profile for a specific web site you search for. Obviously, taking a web site's entire color scheme wouldn't be wise. I just use it for getting color scheme ideas - not using the exact color scheme and color hex rip offs.
abraham 13y ago
You can use COLOURlovers to find complementary colors. http://www.colourlovers.com/palettes/search http://www.colourlovers.com/palettes/search

ahknight 13y ago

Open up any color palette tool and switch to HSB mode. Move H around and leave S & B alone.

msutherl 13y ago
No! Hue does not vary independently from perceived saturation and brightness in the HSB color space. You would need to use something like the Munsell system to achieve this.

nlh 13y ago

Agreeing with the other reply here, and I'll expand on it a bit. When I just did a big redesign of my company's website, I spent probably far too much time playing with the color palette to get it "just so". I'm not a pro designer btw, but I wanted to get this as right as possible as early as possible so I had a good, well, palette :) to work with. Agreed that one of the discoveries I made is that HSB feel like the more "technical" way to design a color palette, and it felt more right from an engineering perspective. You define your colors as pure hues -- that's a top-level decision ("I want my colors for this project to be black, gray, yellow and white"). Those are your base H values. Saturation and Brightness are then your derivatives on the base colors -- lighter in some places, darker in others. This is all self-taught, so my color theory could be way off here, but I also found that you can generate fairly pleasing schemes through regular intervals along the spectrum. Pick a hue, for example, and then look at variations in saturation in steps of 10, 20, 30, etc. It's not an exact harmonic scale (or is it?) but that was enough to give me a good base. Check out the app "Spectrum" if you have a Mac -- I played with a bunch if similar apps and really loved this one the most -- still use it all the time for color exploring: http://www.macupdate.com/app/mac/43784/spectrum http://www.macupdate.com/app/mac/43784/spectrum

fpp 13y ago

Try Kuler by Adobe (free) https://kuler.adobe.com/ https://kuler.adobe.com/

bchar 13y ago

I use Color Scheme Designer: http://colorschemedesigner.com/ http://colorschemedesigner.com/

msutherl 13y ago
This app is great, especially if you don't take its recommendations verbatim. I haven't seen anything else that comes close.

katherineparker 13y ago

Another option for getting a web color scheme: http://webcolourdata.com/ http://webcolourdata.com/ It shows a color profile for a specific web site you search for. Obviously, taking a web site's entire color scheme wouldn't be wise. I just use it for getting color scheme ideas - not using the exact color scheme and color hex rip offs.

abraham 13y ago

You can use COLOURlovers to find complementary colors. http://www.colourlovers.com/palettes/search http://www.colourlovers.com/palettes/search