Cantcolor Open this jpg Read the actual color name so red for the last one say Green Color Models CMYK Cyan Magent a Yellow Black Used in print production Print uses reflected subtractive light model ID: 539265
Download Presentation The PPT/PDF document "Color Basics" is the property of its rightful owner. Permission is granted to download and print the materials on this web site for personal, non-commercial use only, and to display it on your personal computer provided you do not modify the materials and that you retain all copyright notices contained in the materials. By downloading content from our website, you accept the terms of this agreement.
Slide1
Color BasicsSlide2
Cantcolor
Open this jpg
Read the actual color name, so red for the last one say “Green”Slide3
Color Models - CMYK
Cyan, Magent
a, Yellow, BlackUsed in print production. Print uses reflected (subtractive) light model
Ink masks (absorbs) light that would usually be reflected from a white background… you are “subtracting” brightness
Start with white, and as you add inks, you build towards black
Cyan, Magenta, Yellow used in different amounts – theoretically, maximum equal amounts of these inks produce black
Not cost effective, so black ink is used to achieve blackSlide4
Color Models - RGB
Red, Green, Blue
Used in screen (i.e. web) production. Screen uses emitted (additive) light model
CRT (box
tvs
/monitors) had phosphors – substance that glowed when stimulated with an electron gun
LCD accepts energy in one form (electric current) and emits various colors
Start with black (no light emitted) then add various Red, Green, Blue – maximum equal amounts of each give whiteSlide5
Measuring Color – Bits first
We talk about many colors in terms of Bits
We measure how much Red, Green, and Blue a color has
A bit is smalles
t unit of computer storage. It is a one or a zero – or something else (a reflective or non-reflective surface on a CD) that represents one of two states
So, one bit = 2 possible values – 0 or 1
Two bits = 4 possible values – 00, 01, 10, 11
8 bits = 256 possible colorsSlide6
Measuring Color – Powers of 2
Binary works in powers of 2
If there is a 1 in a given column, add that number to running total, if it’s a 0, don’t add
The chart below helps translate the binary number 10010110
128+0+0+16+0+4+2+0
10010110 Binary = 150
128
64
32
16
8
4
2
1
1
0
0
1
0
1
1
0Slide7
Measuring Color – 24 bit RGB color
Back to RGB – 24 bit color
8 bits for red, 8 for green, 8 for blue
If a value is 0 (00000000 in binary) none of that color
If a value is 255 (11111111 in binary) max of that value
Max red shown here 0 note the RGB valueSlide8
Measuring Color – 24 bit CMYK color
Now CMYK
Values of 0 to 100 for each component
If a value is 0 none of that color
If a value is 100 max of that value
Max red shown here – combination of 100 Magenta and YellowSlide9
Measuring Color – Hex
Hexadecimal is another form of a number
Unlunk
decimal (10 “digits”, 0-9), hex uses 16 “digits”, 0-9 and A-F)
One hexadecimal character represents 16 possible states
Usually 2 characters
00=0, FF=255
Hex
Decimal
0
0
1
1
2
2
3
3
4
4
5
5
6
6
7
7
8
8
9
9
A
10
B
11
C
12
D
13
E
14
F
15Slide10
Measuring Color – Hex Conversion
Hex values usually consist of 2 Hex characters
To convert from hex to decimal, take first number, multiply it by 16, then add second number
Convert 32 in Hex to decimal
3*16=48 + 2 = 50
Convert AB In hex to Decimal
10 * 16 = 160 + 11 = 171Slide11
Measuring Color – Hex Colors
Hex color numbers usually start with #
Usually 2 characters for each red, green, blue
#FF0000 = Red
#00FF00 = Green
#0000FF = Blue
#000000 = Black
#FFFFFF = White
Any equal amount RGB– i.e. #333333 – will be a shade of gray…Slide12
Color Schemes – The Color Wheel
Tool for combining colors to find a pleasing arrangement
Helps you pick opposing colors to make a “color harmony”
There are warm (red, yellow, orange) – energetic
And cool (blue, green, purple) –soothing, calm
White, Gray, Black – neutralSlide13
Adobe colors
Go to color.adobe.com
A color will be labeled, basic, your main color ..The colors 2 to the left, 2 to the right rae
Slide14
Complementary colors
Exciting, Vibrant, Dynamic
Colors
opposite each other
on wheel
Colors almost “fight” to cancel each other out if used in equal weight
Note the rule
Consider one color dominant, the other for highlights, instead of equal weight
Avoid use for lots of text, great for logos Slide15
Analogous
Harmonious, Pleasing
Colors near each other on color wheel
May require tweaking of contrast, for dominant color
Nice components of an image, they blendSlide16
Monochromatic
Soothing, Sedate, Clean
Variations of a single color
May require tweaking of contrast, for dominant color – it won’t “pop”Slide17
Triad
Harmonious, good contrast
Three equidistant spikes on color wheel
Not as jarring as complementary, good possible choice for infographics/logos
Consider one dominant, other two accentSlide18
Compound
Two colors adjacent, two colors opposite
Good contrast, less eye strain then complementary
Not as jarring as complementarySlide19
Shades
Monochromatic
Most calmingSlide20
Use your color
Once you have a color identified, Can find the color value…
Then reproduce that color exactly in the color panel
If using Adobe CC at home, you could login to your account on the Adobe color site, save your color theme, then import the entire theme into Illustrator…
But this is impractical in labSlide21
Save your color
Then, from the swatches panel, can add (save) the color
Swatches panel, can add (save) the color – drag it down
Note you can find a complimentary color from the panel menuSlide22
Message of color
Red evokes excitement, youthfulness, and boldness
Orange evokes friendliness, cheerfulness, and confidence
Yellow optimism, clarity, and warmth
Green evokes peace, growth, and health
Blue evokes trust, dependability, and strength
Purple evokes creativity, imagination, and prudence
Gray evokes balance, neutrality, and calmness
Not an exact science (for us) – but lots of research goes into use of color to influence!Slide23
Infographic Reading
https://blog.hubspot.com/hs-fs/hub/53/file-1661939313-jpg/psychology-of-color-ig.jpg?t=1474905933766
http://burnettsboards.com/wp-content/uploads/2013/06/color-meanings1.jpg
http://i.imgur.com/TjQYSMY.jpg
http://coschedule.com/blog/color-psychology-marketing/#combos