The web is quite an ugly place. There are islands of beauty and good design, but on the whole the internet is ugly. But don’t fret! There are little things you can do to improve your corner of the web.
Color basics are taught in design school, but many people play with colors without thinking about what the implications are. In this article I will talk about color basics, and tomorrow I will follow up with some uses of color.
The primary colors that were learned in grade school are red, yellow and blue. We learned that we could make any color we wanted by mixing those colors together. Well, that is partially right. For printing, we use cyan, magenta, yellow and black and for screens we use red, green and blue. The painting and printing color systems are both based on subtractive color. The color on screens (colors of light) are called additive color.
But, on a color wheel, the primaries are always red, yellow and blue. Secondary colors can be made by mixing two primary colors together (orange, green and purple). Tertiary colors are made by mixing a primary and a secondary color.
Chroma, intensity, saturation and luminance/value are inter-related terms and have to do with the description of a color.
- Chroma: How pure a hue is in relation to gray
- Saturation: The degree of purity of a hue.
- Intensity: The brightness or dullness of a hue. One may lower the intensity by adding white or black.
- Luminance / Value: A measure of the amount of light reflected from a hue. Those hues with a high content of white have a higher luminance or value.
Shade and tint are terms that refer to a variation of a hue.
- Shade: A hue produced by the addition of black
- Tint: A hue produced by the addition of white.
Ok, now we know the terms. How do you pick a color scheme? I have outlined some of the basic color relationships below:
-
A monochromatic color scheme
Monochromatic Colors Colors that are shade or tint variations of the same hue.
-
Complimentary Color Scheme
Complementary Colors Those colors across from each other on a color wheel.
- Split-Complementary Colors One hue plus two others equally spaced from its complement.
- Double-Complementary Colors Two complementary color sets; the distance between selected complementary pairs will effect the overall contrast of the final composition.
-
Analogous Color Scheme
Analogous Colors Those colors located adjacent to each other on a color wheel.
-
Triadic Color Scheme
Triad Colors Three hues equally positioned on a color wheel.
Colors are fun to play with, and can make your website beautiful. Just please, avoid these common mistakes:
- Using a triadic color scheme of just the primary colors.
- Using red and green alone together if it is not Christmas.
- Having your colors so similar that people can’t quite tell if there is a difference.
- Using complimentary colors as text and background colors.
Some places to play with colors are: Adobe Kuler and COLOURlovers. These tools allow you to create color schemes and download color pallets for use in Adobe software.
