1 / 41

Color

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?. Long.

kyne
Télécharger la présentation

Color

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Color Background

  2. 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

  3. What is Color? Long 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. Short Source: Bennett, J. (2005). Design Fundamentals for New Media. Thomson Delmar Learning: New York.

  4. 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 Monitor CYMK - print Source: Bennett, J. (2005). Design Fundamentals for New Media. Thomson Delmar Learning: New York.

  5. 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.

  6. 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.

  7. 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. http://www.colorotate.org/

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

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

  10. Brain absorbs color and tries to balance total absorption of Red with its complement, Orange Source: http://poynterextra.org/cp/colorproject/color.html After Image will be Green

  11. After Image will be Orange

  12. After Image will be Purple

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

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

  15. A color wheel

  16. Varying saturation, with brightness held constant

  17. Varying brightness, with saturation held constant

  18. http://kuler.adobe.com/#create/fromacolor 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

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

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

  21. Monochromatic example

  22. Complementary Two opposite colors with any brightness or saturation

  23. Complementary: various blues, with red-orange highlights http://designwashere.com/complementary-colors-in-web-design/

  24. Complementary

  25. Analogous Two or more colors with hues close together.

  26. Analogous

  27. Analogous: red-orange through yellow-green

  28. Triadic: Any three colors spaced equally around CW.

  29. Triadic: red, yellow, blue

  30. Triadic: red, yellow, blue HSB values 240, 74, 80 55, 42, 100 351, 63, 83 240, 59, 57 55, 91, 91

  31. Sites | Color • http://websitetips.com/colortools/sitepro/ • http://colormixers.com/mixers/cmr/ • http://colorschemedesigner.com/ • http://learn.colorotate.org/learn-more.html • http://www.devwebpro.com/25-popular-color-scheme-and-palette-generators/ • http://www.allwebdesignresources.com/webdesignblogs/graphics/webdesigncolorcombinationsguide/

  32. Specifying Color Hexadecimal

  33. 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)

  34. Color Hexadecimal value: FF0000 FF 00 00 Red Blue Green

  35. Hexadecimal based-16 0 1 2 3 4 5 6 7 8 9 A B C D E F 0 1 2 3 4 5 6 7 8 9 A B C D E F 00 01 02 03 04 05 06 07 08 09 0A 0B 0C 0D 0E 0F 10 11 12 13 14 15 16 17 18 19 1A 1B 1C 1D 1E 1F - 31 F0 F1 F2 F3 F4 F5 F6 F7 F8 F9 FA FB FC FD FE - 254 FF - 255 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 = 20 RGB Values: 0 – 255 Hexadecimal: 00 - FF

  36. Web site • http://poynterextra.org/cp/colorproject/color.html

More Related