SEARCH
  Basics Design Principles Using Color Wheels in Web Design

Using Color Wheels in Web Design

Color Theory is the art of mixing colors to achieve desired effects. The way colors are combined can be used to create different feelings and responses. The easiest way to explain relationships between different colors is to display them in a color wheel.

img

Color combination is really the most important part of color theory and color design, and also the hardest one-- It is always closely connected with your personal judgement and color perception. There are, however, some guidelines that can be used to make a color combination that is interesting and pleasing for the eye.

First of all you should create a color palette of your site. You can use for it a color wheel and colorschemedesigner.com

There are different kinds of palettes. For example, a monochromatic palette. There is only one color in this panel, but with different values of saturation and brightness. Such schemes are accurate, noble and have a calming effect.

Look at the examples below: you can use the first color as a primary one, the second color - for a text or a background, the third color - for a background or a text, the fourth and the fifth ones for various graphic elements and accents.

img

Example: a cool Flash CS3 teplate

img

Complementary palette

It is a harmony of two contrasting colors that are chosen with help of the circle and one of which is to be the basic. The other colors in the palette are derivatives with appropriate saturation and brightness in accordance with the two initial colors.

img

Example: a cool Flash CS3 teplate

img

Split complementary palette

It is like the previous panel, but in this case one of the contrasting colors is divided into two adjacent colors.

img

Example: a cool Flash CS3 teplate

img

Analogous palette

Analogous schemes are based on three colors that are situated on the wheel next to each other. One of them is the main color and two others are auxiliary.

img

Example: a cool Flash CS3 teplate

img

Tetradic color schemes are probably the most difficult schemes to pull off effectively. This scheme uses two pairs of opposite colors.

img

img

Below you can find some resourses which will help you to work with colors.

Colorpilgrim offers tools for creating color palettes. The ColorClipper bookmarklet lets you easily collect colors and other tools let you create palettes from uploaded images or from scratch.

img

Check My Colours is a tool for checking the contrast of foreground and background elements in a website design to make sure this contrast is easily noticed.

img

Color Thief uses JavaScript and Canvas to grab the dominant color or color palette from an image.

img

COLOURlovers is a creative community where people from around the world create and share colors, palettes and patterns, discuss the latest trends and explore colorful articles... All in the spirit of love.

img

Explore, create and share your color themes with Kuler

img

ABOUT THE AUTHOR

Stacy Summers

Hello, I'm Stacy Summers. I want to show you amazing web things and hope you will love them just like me. If you have any questions, please contact me via email (webwdl@gmail.com) or visit my Facebook page.

subscribe to newsletter