spacer

Webref WebRef   Sitemap · Experts · Tools · Services · Newsletters · About i.com

home / authoring / graphics / color / nondesigners / chap2 / 1 To page 1To page 2To page 3To page 4current pageTo page 6
[previous] [next]

Web Graphics for Non-Designers, Chapter 2: Using Color

UNIX System Administrator - SUN Solaris, Veritas, EMC, Shell Scripting, SAN (NYC)
Next Step Systems
US-NY-New York

Justtechjobs.com Post A Job | Post A Resume
Developer News
ActiveState Debuts Open Source Business Suite
Salesforce Offers Visual App Builder
Codesion Steps Out From CVS's Shadow


Complementary

Selecting colors opposite each other on the color wheel creates a scheme of complementary colors. The opposite of the primary blue, as per the diagram below, is orange. For purple, the complementary is yellow, and so on. In each of the swatches below, the two tones on the left complement the two on the right.

Complementary colors

Complementary swatches:

Complementary Color Swatch Example

Complementary Color Swatch Example

Complementary Color Swatch Example

Once you have mastered selecting complementary colors, it may be time to experiment with the double complement, that is, choosing two sets of complementary colors. Alternatively, consider the split complement that chooses a hue and two colors adjacent to its alternate. The diagram below shows an example of color positioning for a double complement (left) and split complement (right) on a color wheel:

Double Complement Example

Split Complement Example

Remember that simplicity is one of the key components of successful web design. There is nothing to be ashamed about using a scheme in which you have confidence, rather than striking out into fresh color ground simply for the sake of it.

Example: fusion.com.au

Screenshot:

fusion.com.au

Complementary Color Swatch Example

Fusion are new media developers. Their site presents a bold and confident appearance with a striking complementary combination.

Complementary color schemes can give sites a vibrant feel. Sites designed to appeal to children often use these themes to appear exciting and dynamic. Such choices also appeal to parents buying for their children, who understand that a lively environment can be a positive influence on a growing mind. A complementary scheme commonly used is the red and green combination invoked by retailers during the Christmas season. You should be conscious, though, of the way in which complementary colors can behave near each other. Color behavior is discussed at a later point in this chapter.

These combinations can also present a subdued feel if de-saturated hues are used. Also, be aware that the screen space devoted to your main colors can substantially alter your final effect. As an example, a page that is almost entirely monochromatic, but with a slight addition of titles or features in a bright complement can create a punchy effect without looking like it is an entertainment site for children.


home / authoring / graphics / color / nondesigners / chap2 / 1 To page 1To page 2To page 3To page 4current pageTo page 6
[previous] [next]


The Network for Technology Professionals

Search:

About Internet.com

Legal Notices, Licensing, Permissions, Privacy Policy.
Advertise | Newsletters | E-mail Offers

webref The latest from WebReference.com Browse >
Use Web Caching to Make Your Web Site Faster · Creating an Online Shopping Cart Mechanism in PHP · Log JavaScript Errors Using an AJAX-driven Web Service
Sitemap · Experts · Tools · Services · Email a Colleague · Contact FREE Newsletters 
 The latest from internet.com
Configuring Granular Settings for a Database Level Audit · The Perils of a Web 2.0 Transition on Your Business Processes · Facebook Redesigns Site —Again — Nears 400M Mark

Created: December 2, 2002
Revised: December 2, 2002

URL: http://webreference.com/authoring/languages/html/definitive/1/5.html