I'm trying to create my own layout for bootstrap. I found a lot of articles about choosing colors to layout, but layout also need some shades of grey and black for sidebars, navbar, to make some contrast between panel and background, etc. Do you have some advice how to choose this colors to fit base?

  • Whatever you do,keep in mind some people have trouble differentiating colors and contrast and therefor don't rely on similar shades of colors to mean ANYTHING – downrep_nation Dec 20 '15 at 15:19
  • 1
    Im not sure exactly what's being asked here. A layout doesn't need blacks or grays to create contrast they simply have to be different enough colors not to blend. If you do want to use a black or gray to create more contrast then just pick a dark enough shade to create a visual separator and make the element stand out. – DasBeasto Jan 19 '16 at 18:54
  • Actually, contrast is usually something most people don't have trouble with...and is why it's often part of accessibility recommendations. – DA01 Jan 19 '16 at 20:11

Would you be willing to share some ideas for colors you have so far so that we can all take a look?

Regardless of downrep_nation's comment, I think it's important to understand a bit about color theory. There are hues, shades, tints and tones.

A hue is a color.
Shades = any color that is mixed with black.
Tints = any color that is mixed with white.
Tones = any color that is mixed with gray. (They usually work in any color scheme)

When it comes to design and colors, whether it's for accessibility, etc, what's incredibly important is contrast. Lack of contrast can make an interface dull, boring, and even difficult to read. Too much contrast can make an interface overwhelming, nauseating, and also difficult to read.

That’s the best color advice I can give to you without knowing what kind of site you're trying to build, who your audience is, etc. (because you usually can't decide on color until you have those questions answered).

| improve this answer | |

Not the answer you're looking for? Browse other questions tagged or ask your own question.