No content

No content

‣ yellow/red light: vibrant/stimulating ‣ can portray warmth as well as danger and risk ‣ high arousal colours, especially when used in saturated shades ‣ perceived to be closer to the viewer = enhances perception of perspective ‣ white/blue light: cool/calm ‣ can portray tranquility ‣ low arousal colours, especially when used in pastel shades ‣ perceived to be further away from viewer = enhances perception of perspective cool warm chromodynamics

‣ associations:
 fire / blood / energy / war / danger / passion / desire / love ‣ strong impact colour with high visibility ‣ expression of urgency / alert / error RED

‣ associations:
 sunshine / joy / health / enthusiasm / happiness/ creativity ‣ strong impact colour with high visibility ‣ expression of strength / endurance ORANGE

‣ associations:
 sunshine / joy / happiness / intellect / energy / caution / jealousy ‣ effect depending in additional colours ‣ expression of pleasant and cheerful emotion, used for highlights;
 if overused or in dull shades - can become unappealing YELLOW

‣ associations:
 nature / growth / hope / harmony / safety / fertility / money ‣ calm impact, suggesting experience ‣ expression of restful and calm emotions;
 also used for eco / green products GREEN

‣ associations:
 sky / water / depth / loyalty / trust / truth / intelligence / wisdom ‣ calm and tranquil impact ‣ expression of depth, expertise and stability BLUE

‣ associations:
 royalty / luxury / ambition / nobility / creativity / mystery ‣ impact varies with hues ‣ expression of nostalgia / romance PURPLE

No content

No content

hellogeri.com Geri Coady Colour Accessibility Five Simple Steps

hellogeri.com/about full colour vision

hellogeri.com/about Deuteranopia (green-blindness) (common)

hellogeri.com/about Protanopia (red-blindness) (rare)

hellogeri.com/about Tritanopia (colour vision deficiency for blue tones) (very rare)

An explanation of colorblindness An explanation of colorblindness is a post on The Hickensian photo courtesy of David Shrigley

yellow red blue orange purple green yellow-orange red-orange red-purple blue-purple blue-green yellow-green

No content

‣ effect and interpretation of colour emphasized or changed by values ‣ good colour schemes combine carefully selected colours by shade, tone and brightness for maximum impact ‣ screen display will influence decisions due to nature of light used ‣ pure colour value ‣ colour value changed towards shade of grey, affecting chroma ‣ colour value changed by addition of black/white

No content

No content

No content

colour combinations

No content

✔

colour scheme combination of tones and shades within the same colour / hue

No content

No content

colour scheme combination of adjacent colours

No content

No content

colour scheme combination of 2 colours from opposite sides of the colour spectrum combination of 4 colours (each pair adjacent to each other) from opposite sides of the colour spectrum

No content

No content

No content

colour scheme combination of 3 colours evenly spaced around the colour wheel

No content

No content

No content

colour scheme combination of colours, often 2 groups of similar hues, chosen specifically from the colour spectrum

No content

No content

No content

saturation brightness hue

No content

colours in code caniuse.com

colours in code color: #FFB000; color: rgb(255,176,0); HEX: RGB: ! NOTE: HSB != HSV || HSL cannot be used in code

colours in code COLORS by mattpatenaude.com HSL COLOR PICKER
 by Brandon Mathis hslpicker.com

Chris Coyier - HSLa Explorer css-tricks.com/examples/HSLaExplorer

image credits: • photo: Geri Coady, by Jeffrey Zeldman on Flickr • photo: ORANGE : pumkin on leaves, by pink sherbert on Flickr • photo: YELLOW : autumn leaves, via Flickr • photo: GREEN : Photomicrography, via The Big Picture (Boston.com) • photo: BLUE : waves, by somebody_ , via Flickr • photo: PURPLE : flower close up, by cobalt123 via Flickr • photo: colour splash, via theinspirationgrid.com • photo: coloured plastic, via Frank Chimero on gimmebar.com • photo: “image the green is red” by David Shrigley, via “An explanation of colorblindness” by Jon Hicks • Life, magazine illustration by Coles Phillips, 1927 site references • An explanation of colour blindness, Jon Hicks • Geri Coady, website - hellogeri.com • colour bookmarklet - wearepandr.com/labs/colour_bookmark • Symbolicons - symbolicons.com • Adaptd - adaptd.com • Kaleidoscope App - kaleidoscopeapp.com • Gift Rocket - giftrocket.com • You Know Who Design, Sarah Parmenter - youknowwhodesign.com • duoh! - duoh.com • Veerle’s blog - veerle.duoh.com

Prisca Schmarsow [email protected] ! graphiceyedea.co.uk @prisca_eyedea