2Jul/070
The top ten of finding the right color scheme
Hi, and welcome to my blog. It's about web engineering.
If you want to find more, please see the about page.
Today I'll talk about a problem of many graphic designers:
Build a good color palette for your design works.
The situation is: you need to produce a logo, create a new company image or build a website.
The design floats in your head, but you simply can't grasp the "right" colors it needs.
For my introduction in the blog's world as a writer, I've chosen to share what I think is the top ten of colour choosing.
- Install a color picker: If you use Firefox, install the extension ColorZilla. As the homepage says, it is an avanced eyedropper and colorpicker. Two clicks and a new icon sits in the status bar: No more messing with exadecimal codes when writing your CSS files! Simply click on the eyedropper, then on the place you need to sample and you've captured the wonderful color you've seen on that page! You can copy the hex code into the clipboard by clicking again on the eyedropper with the right mouse button (on Windows) or command click (on Mac) and choosing between five notations, three RGB variations and two hex ones.
- Go to a color community: There are sites purely devoted to share the best in colors. Web and graphic designers meet there to illustrate their palette, they even care to give a title and an explanation! Feel free to start from there.
- http://kuler.adobe.com/
- http://www.colorcombos.com/
- http://www.colourlovers.com/
- http://beta.dailycolorscheme.com/
- http://www.colorschemer.com/online.html
- http://www.colorschemer.com/schemes/
- http://www.colorjack.com/
- http://www.webdevelopersnotes.com/design/color_combina...
- http://adampolselli.com/article/get-the-look/
- Learn color meanings and theory: Sometimes you want to choose the "right" armonies, the ones that better stimulate some psychological patterns, and need more informations. Deep dive in these pages.
- http://www.infoplease.com/spot/colors1.html
- http://www.factmonster.com/ipka/A0769383.html
- http://www.infoplease.com/ipa/A0932396.html
- http://www.infoplease.com/ipea/A0934307.html
- http://www.digital-web.com/topics/color/
- http://www.stylegala.com/articles/design_psychology.htm
- http://www.worqx.com/color/
- http://www.ysbl.york.ac.uk/~mgwt/KKwebcourse/colourscien....
- http://www.colormatters.com/
- http://www.wetcanvas.com/ArtSchool/Color/ColorTheory/
- http://colortheory.liquisoft.com/
- Download style and gradient sets: Here are a set of pre made goodies ready to be downloaded and imported into Photoshop and Illustrator.
- Check your design for for colorblindness: Always check your colors for various types of vision disparities, the most important are the protanopia, the deutanopia and tritanopia. Sometimes slighting adjusting your design can really change radically the situation. These people will thank you, doing so will make you look more professional, and it's a requisite for some websites in the public administration.
- Generate a color palette from a photo: This is really interesting, you can use a color picker in your favourite photo editor (remember to set the sample pattern to something like a 5x5 matrix), let a computer do it for you, or even look at some compositions made extracted from art.
- Build a color scheme rotating a color: Building a color scheme can be done in more than a way. One of the most interesting ones involves rotating (or "shifting") a color on the color wheel, and look at the combinations made drawing a triangle (triadic), a square (tetradic) and a line on the opposite side (complimentary colors). Different techniques are applied here, because color composition can be done in different spaces (a cube, a sphere and so on..) but everything is computed automatically.
- http://www.steeldolphin.com/color_scheme.html
- http://colorblender.com/
- http://www.colorjack.com/sphere/#
- http://www.easyrgb.com/harmonies.php
- http://pourpre.com/colordb/?l=eng&t=tr
- http://www.raquedan.com/random100.php
- http://www.defencemechanism.com/color/
- http://wellstyled.com/tools/colorscheme2/index-en.html
- http://www.modernlifeisrubbish.co.uk/article/web-2.0-col...
- http://www.somacon.com/p142.php
- http://www.december.com/html/spec/colorshades.html
- http://infohound.net/colour/
- http://www.dhtmlgoodies.com/scripts/color-schemer/colo...
- http://slayeroffice.com/tools/color_palette/
- http://www.neteffect.dk/colormatch/
- http://dev.sessions.edu/ilu/ilu_1.html
- http://www.colorsontheweb.com/thecolorwizard.asp
- http://www.yafla.com/dforbes/yaflaColor/ColorRGBHSL.aspx
- http://www.paciellogroup.com/resources/contrast-analyser.htm
- Play with the colors: You really don't need to know all the details... just move some knobs, click some buttons and these sort of "widgets" will do spring the colors for you. Guess what? It's fun, also!
- http://www.ideo.com/visualizer.html
- http://www.pic2color.com/
- http://www.triplecode.com/munsell/
- http://www.color-inspirator.com/
- http://www.dulux.co.uk/webapp/wcs/stores/servlet/Colours...
- http://www.limov.com/colour/
- http://www.krazydad.com/colrpickr/
- http://www.telecable.es/personales/alberto9/color/index.htm
- Inspirate from other projects: You can "borrow" some combinations from other websites, projects or even fashion trends of the past.
- Splash colors: If you got Photoshop, open it, then from the brushes palette, choose a special effect brush, a random color, make it 70% opaque and start to paint randomly on a white canvas. In overlapping areas the colors will start to "mix together". Use the colorpicker and you'll find some pure gems.