INTRO TO MULTIMEDIA.

Alejandra Jarabo
Media Arts & Technologies

GENERAL TERMINOLOGY FOR DIGITAL COLOR.

ADDITIVE COLOR
White light is a combination of many different colors, a continuum of wavelengths organized into "bands" which we label with names (blue, green, red etc).
When equal parts of each of the three major bands are combined you get white light.
When two primary colors of light are added together, you get a color that is brighter than either of its components.
Red, Green and Blue are the primary colors when dealing with light.
TV and computer monitors use additive color.

ADITIVE COLOR  
ADITIVE COLOR SUBTRACTIVE COLOR additive color
Color systems


SUBTRACTIVE COLOR
A subtractive color model explains the mixing of a limited number of dyes, inks or paint pigments to create a wider range of colors, each the result of partially or completely subtracting (that is, absorbing) some wavelengths of light and not others.
The color that a surface displays depends on which parts of the visible spectrum are not absorbed and therefore remain visible.
In a substractive system we start with a light surface and we "add color". The mix of all colors would produce Black or a dark brown.

In traditional painting Red, Yellow and Blue are the primary colors. The secondary colors are Orange, Green and Purple, produced by the combination of 2 primary colors. Each primary color is the complementary of the secondary color made with the other 2 primaries: Red is the complementary color of Green, Yellow is the complementary color of Purple, Blue is the complementary color of Orange.

n color printing, the usual primary colors are Cyan, Magenta and Yellow (CMY). Cyan is the complement of red, meaning that the cyan serves as a filter that absorbs red. The amount of cyan applied to a white sheet of paper controls how much of the red in white light will be reflected back from the paper. Ideally, the cyan is completely transparent to green and blue light and has no effect on those parts of the spectrum. Magenta is the complement of green, and yellow the complement of blue. Combinations of different amounts of the three can produce a wide range of colors with good saturation.

Primary colors in Traditional painting
Primary colors in Professional printing
painting subtractive palette
subtractive for Printing
subtractive
complementary painting
complementary color blocks
     
  You can see different terms that help define color (Color-Picker window in Photoshop)  

Color Spectrum
(Think of it as an externded view of the rainbow, with all colors at its maximum saturation)

 

Color Hue or Chroma
(defines what non-professionals understand as "color")

 

Color Value
or Tone
(dark value, dark tone versus light value or light tone)
(when we talk about a Tonal value we usually refer to a grayscale value)

 


the color spectrum can be meassured in different ways:

RGB
(red, green, blue)

CMYK
(cian, magenta,yellow, black)

HSB
(hue, saturation, brightness)

LAB
(used for Photography, reflects colors seen in human vision.
More values than in RGB or CMYK )

HEXADECIMAL VALUE
for the web
#98A7BB (graish blue)
#000000 (pure black)
#FFFFFF (pure white)

Saturation
(Notice that less Saturation implies a lighter tone with the same Chroma, since we work with an adaptative system)

HEXADECIMAL VALUE
(numeric value with six digits, defines the color across systems)
Used to define colors for web use (HTML, Java Script...)
First 2 values idicate Red, next 2 values indicate Green, last 2 values indicate Blue

#FF0000
(fully saturated red)
# 00FF00
(Fully saturated, pure green)
#00FF00
(Fully saturated, pure blue)

#00FFFF
(pure Cian, which is made of Green+Blue in the Additive system)
#00FFFF
(pure Magenta, which is made of Red+Blue in the Additive sytem)
#FFFF00
(pure Yellow, which is made of Red+Green in the Additive system)

Contrast

between two Colors or Tones

 

(they don't have to have the same hue,
as in this case)

Could be a light pink against a dark purple ,
alight green against a dark green)

HEXADECIMAL VALUE
now

#FF7F7F
(value/number for the brightest red with 50% saturation)
The value of Green and Blue decrease (toallow for less saturation)
Notice the value for both Green and blue is 7F, whi ch is a letter-number combination

A similar color, but web safe would be
#FF6666
(light red/pink with 60% saturation)

 

Color picker with the
"only Web Colors" checker on

All the colors of the spectrum have been reduced to the
"Web safe" ones.

The colors are organized by hue

(move the spectrum-slider to see the web safe colors with that hue)

HEXADECIMAL VALUES

Black is #000000

dark gray is #333333
(tone above the black in the color-picker image on your left. It is a bit brighter than black. B=20%)

dark/medium gray is #666666
(next gray tone up in the image. More bright, B=40%

medium gray is #999999
(third gray from the top. B=60%)
Notice number values are growing as we go lighter, to indicate a higher value of light.
The value of each component (rgb)has to be always the same, since if we have a difference in those values, we would obtain a color, not a shade of gray)

light gray is #CCCCCC
( tone under the pure white. B=80%)

White is #FFFFFF
(full value for red, green, blue)

Web safe palette as seen in the
Swatches window by loading the
"web-hues" option

253 colors guaranteed to look the same in any computer or device, that means any screen can reproduce them
(mac, PC, Linux, Sillicon Graphix...)

They ocuppy an 8 bit channel, which mean a maximum of 256 values