RGB and hex
On the web, we use RGB (red-green-blue) and hex values to represent colors.
The RGB color system defines all colors as a combination of three different values: a particular shade of red, another of green, and another of blue. So:
rgb(59, 89, 145) equals Facebook blue
rgb(0, 0, 0) equals black
rgb(255, 255, 255) equals white
The hex color system converts each value to a hexadecimal (base 16) representation, like
so:
#3b599b equals Facebook blue
#000000 equals black
#ffffff equals white
Every two characters represents a color value, so for Facebook blue, the red hue is 3b, the green is 59, and 9b is blue.
Why you should care about color?
If someone handed you the keys to your dream car, for free, your head would explode with excitement, right? Of course!
But what if the car was painted in your most-hated hue? Or each panel was a different color entirely? Or if the interior mixed lime green and construction yellow?You might be a little less excited, right?Colors have meaning. They impart a tone and emotional impact just like fonts do, and that makes them a powerful design tool.
The vocabulary of color
Before we dive into theory, you’ll need to know the following terms:
Primary colors
Primary colors form the basis for all other shades. Humans perceive three base colors: magenta, cyan, and yellow. Every other color we see consists of a combination of these three colors in varying amounts, brightnesses, tints, and shades (see below).Traditionally, we considered red, blue, and yellow to be the primary colors, but research has shown that magenta, cyan, and yellow better describe our experience of color.