Color Theory

1
Color Theory

• Peter Granuzzo

2
Color Theory

• The comprehension of color relationships, which
  enables practical color mixing
• Involves the visual impacts of different color
  combinations

3
Color

• Perceived visual sense
• People sense color in terms of attributes
• Amount of green or red
• Amount of blue or yellow
• Level of brightness

4
Color Models

• Computer monitors and TVs display color based on
  the RGB model
• Pixels made up of red, green, blue lights
• Each color has a value ranging from 0 to 255
• 16.7 million different combinations

5
Color Models

• Hexadecimal colors
• System for displaying colors on the web
• RGB model with different value system
• Each RGB value determined by two digits ranging
  from 1 9 and A F
• For example, white is FFFFFF

6
Color Models

• Web-safe model
• Lowest resolution screens (8-bit) display 256
  colors
• Differences between Macs and PCs reduced usable
  web colors to 216
• Somewhat outdated

7
Application to Web Design

• Color is extremely important to web design
• Provides users with first impression
• Choosing colors and combinations is directly
  linked to the content of the site

8
Warm Colors/Cool Colors

• Warm colors yellows, oranges, browns,
  yellow-greens, orange-reds
• Aggressive and exciting
• Cool colors blues, greens, pinks, purples,
  blue-greens, magentas, blue-reds
• Soothing and calming

9
Neutral Colors

• White, black, gray
• Good for backgrounds
• Enhance the effect of warm colors

10
Multi-color

• Not advised
• Combining warm and cool colors leads to confusion
• Site seems cluttered

11
Color Harmony

• Balance is key
• Too much color chaos
• Too little boring
• Best to have very few main colors with shade and
  tint variations

12
Text Colors

• Requires significant consideration readability
  is a top priority
• Dark text needs light background and vice versa

13
Optimization

• Choice of colors plays a part in the optimization
  of site
• More colors bigger file size
• Limiting use of colors allows for faster loading

14
Adding Color to Your Site

• It is best to format colors in CSS
• Only a few colors are recognized by their name
  use hexadecimal system
• Code editors like Dreamweaver allow the designer
  to select a color and the hexadecimal code is
  automatically inserted
• Charts available online

15
Sources

• http//www.webexhibits.org/colorart/color.html?gcl
  idCOqU1seU7p0CFchn5QodA37BLg
• http//www.colorcombos.com/color-theory-article.ht
  ml
• http//www.webdesign.org/web-design-basics/color-t
  heory/the-importance-of-color-in-web-designing.124
  37.html
• http//www.colorsontheweb.com/colorsontheweb.asp

16
Discussion

• http//colorschemedesigner.com/
• http//www.ebay.com/
• http//en.wikipedia.org/wiki/Color_theory
• http//www.gardenguides.com/
• http//www.havenworks.com/
• http//www.dokimos.org/ajff/