Color Background

What is Color? Aspect of vision Physical reaction of the eye and the automatic interpretive response of the brain to wavelength characteristics of light Color is light - different wavelengths are seen as different colors

What is Color? Color is what we perceive as a result of different wavelengths of light. E.g., Sounds with long wavelengths = low noise. Light with long wavelength displays different colors than light with short wavelengths. Source: Bennett, J. (2005). Design Fundamentals for New Media. Thomson Delmar Learning: New York. Long Short

What is Color? Gamut: refers to the entire spectrum of colors available for use in a specific medium. The entire visual spectrum. White triangle –colors that can be produced by a monitor. Black area – colors that can be produced using the CYMK color system for printing Source: Bennett, J. (2005). Design Fundamentals for New Media. Thomson Delmar Learning: New York. Monitor CYMK - print

Computer monitor Monitor made up of Red, Green and Blue dots. See them as homogenous color. RGB Color EXAMPLE: If red and green dots are at 100%, while blue dots not lit, we see yellow color. Dots can have value from 0 to 255. Total number of possible colors is 256*256*256 = 16,777,216.

RGB Colors Color represented by three numbers: 0, 0, 255 First number represents red Second represents green Third represents the blue. Pure blue color is 0, 0, 255.

Colors | Terms Hue - the edges of the square Saturation – where color is placed between grey middle and the colored edge Value (i.e., brightness or luminance) the intensity of the color and is the third attribute.

Colors Contrasting colors (complements) are diametrically opposite on the color circle.

Color complements Red, Yellow, Blue primary colors Colors opposite primary are complements Green complement Red Purple complement Yellow Orange complement Blue

After Image will be Green Brain absorbs color and tries to balance total absorption of Red with its complement, Orange Source:

After Image will be Orange

After Image will be Purple

Need a model that relates subjective sensation of color to measurable phenomena Color & Science

Color Models 1. An artist’s color wheel: red, yellow, and blue (RYB) 2. Additive color: red, green, blue (RGB) 3. Subtractive color: cyan, magenta, yellow, and black (CMYK) 4. Hue, saturation, and brightness (HSB)

A color wheel

Varying saturation, with brightness held constant

Varying brightness, with saturation held constant

Four Color-Harmony Schemes Monochromatic: colors of same or similar hue, differing in brightness and/or saturation Complementary: colors approximately opposite each other on a color wheel Analogous: colors adjacent to each other, from any segment of a color wheel Triadic: three colors approximately equally spaced around a color wheel

Monochromatic color harmony: All blue All orange colors of same hue, differing in brightness and/or saturation

H16,S92,B38 H16,S84,B100 H16,S18,B100 Monochromatic color harmony:

Monochromatic example

Complementary Two opposite colors with any brightness or saturation

Complementary: various blues, with red-orange highlights

Complementary

Analogous Two or more colors with hues close together.

Analogous

Analogous: red-orange through yellow-green

Triadic: Any three colors spaced equally around CW.

Triadic: red, yellow, blue

240, 74, 80 55, 42, , 63, , 59, 57 55, 91, 91 HSB values

Sites | Color generators/ generators/ esigncolorcombinationsguide/ esigncolorcombinationsguide/

Specifying Color Hexadecimal

Color Often for Web documents, colors are defined using a hexadecimal notation for the combination of Red, Green, and Blue color values (RGB). The lowest value that can be given to one light source is 0 (hex #00). The highest value is 255 (hex #FF)

Color Hexadecimal value: FF0000 FF Red Green Blue

ABCDEF ABCDEF Hexadecimal based-16 Red value = 10 Hex value = 0a Red value = 11 Hex value = 0b Blue value = 16 Hex value = 10 Blue value = 26 Hex value = 1a Green value = 31 Hex value = 1f Green value = 32 Hex value = A 1B 1C 1D 1E 1F - 31 F0 F1 F2 F3 F4 F5 F6 F7 F8 F9 FA FB FC FD FE FF A B C D E F A 0B 0C 0D 0E 0F RGB Values: 0 – 255 Hexadecimal: 00 - FF

Starts With A B C D E F RGB Val HEX HEX RGBRGB A0A0 176 B0B0 192 C0C0 208 D0D0 224 E0E0 240 F0F A0A 26 1A1A 42 2A2A 58 A 74 A90A 106 A 122 A 138 A 154 A 170 A 186 A 202 A 218 A 234 A 250 A 11 0B0B 27 1B1B 43 2B2B 59 B 75 B91B 107 B 123 B 139 B 155 B 171 B 187 B 203 B 219 B 235 B 251 B 12 0C0C 28 1C1C 44 2C2C 60 C 76 C92C 108 C 124 C 140 C 156 C 172 C 188 C 204 C 220 C 236 C 252 C 13 0D0D 29 1D1D 45 2D2D 61 D 77 D93D 109 D 125 D 141 D 157 D 173 D 189 D 205 D 221 D 237 D 253 D 14 0E0E 30 1E1E 46 2E2E 62 E 78 E94E 110 E 126 E 142 E 158 E 174 E 190 E 206 E 222 E 238 E 254 E 15 0F 31 1F 47 2F2F 63 F 79 F95F 111 F 127 F 143 F 159 F 175 F 191 F 207 F 223 F 239 F 255 F

Web site