Site hosted by Angelfire.com: Build your free website today!
     
   
  Section 1 Section 2 Section 3 Section 4 Section 5  
   
             
Current Location: Home > Presentation Design > Colour >

Colour

The RGB system

The RGB System is the main colour definition system. It uses 3 colours in varying Hue's too create a large number of different colours. The primary colours are Red, Green and Blue


Hue with the RGB system

If a colour has a blue Hue it is considered a variant of the primary colour Blue and is distinguished from other colours. Too get specific colours you change the Hue.

Example - Hue

RED + YELLOW = ORANGE

  Red Green Blue
RED 255 0 0
YELLOW 255 255 0
Calculations 255 + 255 / 2 = 255 255 + 0 / 2 = 127.5 0 + 0 / 2 = 0
ORANGE 255 127 0

Saturation with the RGB system

Saturation refers to how pure the hue is with respect to a white reference. A de-saturated colour looks more pastel and hence more white looking pink which looks pinkish. Too accomplish this you simply move all the colours closer too white

Example - Saturation

RED -> PINK -> WHITE

  Red Green Blue
RED 255 0 0
RED1 255 85 85
RED2 255 153 153
RED3 255 204 204

The Next Step at 255,255,255 will make the colour white
RED3 is less saturated than RED1


Making a colour darker with the RGB system

To make a colour Darker you simply adjust the RGB values towards black

Example - Darkness

RED -> DARK RED -> BLACK

  Red Green Blue
RED 255 0 0
RED1 204 0 0
RED2 153 0 0
RED3 102 0 0
RED4 51 0 0
RED5 0 0 0

The Colour Square(Wheel)

Colour Square

Base System

The System works in 2 different Base Systems. Decimal and Hexadecimal. Decimal is the numbers 0 -> 255, and Hexadecimal ranges from 00 -> FF (F is Decimal 15). So 255 in Decimal is FF in Hexadecimal, 153 in Decimal is 99 in Hexadecimal.

Too convert from HEX -> DEC you multiply the first HEX value by 15 (A=10, B=11, C=12, D=13, E=14, F=15) then add the second HEX value EA = (14*15)+10 = 220.

Websafe Colours

Colours do not look the same from one browser too the next. There are 216 colours that should look the same in every browser. In the HEX scale all colours should be in a 33 Index I.E. 33,66,99,CC,FF.


Colour Schemes

Monochromatic colour schemes use a single Hue with different saturations

  • MONOCHROMATIC
  • MONOCHROMATIC
  • MONOCHROMATIC
  • MONOCHROMATIC
  • MONOCHROMATIC
  • MONOCHROMATIC

Analogous colour schemes use hues that are near each other on a colour wheel

  • ANALOGOUS
  • ANALOGOUS

Triadic colour schemes use hues at 3 equidistant points on a colour wheel. Triadic colours are easy to pick when looking at the RGB Values as each occurs once in each place I.E. (255,153,51), (153,51,255), (51,255,153)

  • TRIADIC
  • TRIADIC

Complementary colour schemes use hues on opposite sides of a colour wheel. Complementary colours are easy to pick when looking at the RGB values as each value for R, for G, and for B, will add up to 255. (255,153,51), (0,102,204)

  • COMPLEMENTARY
  • COMPLEMENTARY
000,255,000
051,255,051
102,255,102
153,255,153
204,255,204
255,255,255
Monochromatic
102,255,153
102,255,102
000,255,102
Analogous
102,255,102
255,102,102
102,102,255
Triadic
102,051,102
051,102,102
102,102,051
153,153,204
Complementary

Sample Colour Scheme

Taking the Monochromatic Green Scheme from above you can use any of those green back colours for the backgrounds. For the foreground colours a simple Black for text and maybe a Deep Blue for some other texts

Background
  • 000,255,000 - Green
  • 051,255,051
  • 102,255,102
  • 153,255,153 - Very Light Green (Pastel)
Foreground
  • 000,000,000 - Text
  • 000,000,255 - Blue Text