<<

Additive and Subtractive (Reductive) is what we normally think of as RGB mode. The name comes from the fact that the are created from , and when combined they become . The absence of all colors produces .

• Subtractive color, sometimes called Reductive, is what we usually think of as CMYK. This is the mode that is often used in printing. It performs oppositely to the Additive model, combining to form Black and subtracting to form white. , Brightness, Saturation, Temperature, Contrast • Hue is, technically, the color "reflected" from or absorbed by an object. In simple terms, it refers to the name of the color, like ", , ". Brightness

• Brightness refers to how much ‘white’ or light the color contains - think of the dimmer switch-the intensity of the light Saturation

• Saturation (aka Chroma or Intensity) refers to the hue's freedom from "dilution" with white, black or another hue. A hue with no other colors mixed in is in the most saturated form. Temperature

• Temperature refers to the emotional and physical sensations of color. , oranges, and are considered "warm" while blue, green, and are known as "cool" colors. Contrast

• Contrast refers to the amount of vibration caused between two colors. Maximum contrast is either , or black and , hence the use in street signs.

Color Wheel

• A is a visual expression of the color palette. • A color wheel is divided into three categories: primary, secondary, and tertiary. • The three primary colors are red, yellow and blue. These colors are considered to be foundation colors because they are used to create all other colors. • By combining two of the primary colors, three secondary colors are formed. They are , green and violet. • The six tertiary colors are made by combining a primary and an adjacent . • These colors are red-orange, red-violet, yellow- green, yellow-orange, blue-green and blue-violet.

The Combination

• Monochromatic color schemes are derived from a single base color, and extended using its shades and tints (that is, a color modified by the addition of black and white). Consider, for example, a saturated green (RGB {0,255,0}). The swatches each show the pure hue in the center, with white being added to the right, and black to the left. In each case, the core hue remains identical. Red on , Mark Rothko The Monochromatic Color Combination

A monochromatic is often considered for sites where content is of extreme importance, or when the opinions presented are of a moderate nature. It can give a site a clean and classic look, but also provides excellent opportunities to let full color photographs dominate. http://www.colourlovers.com/ http://www.ColorSchemer.com/

Monochromatic schemes are often appropriate for serious political and business sites such as those of some banks where instilling customer confidence in their experience.

http://www.martinadolfsson.com/

They are also highly suited to fashion sites where the understated monochromatic scheme supports the branding, but nevertheless allows the photographical elements to provide a focus. Playing with in photoshop

In the Hue/Saturation Adjustment Layer dialog box, adjust the saturation slider. You can also adjust the slider.

In the dialog box, click on the brightness or saturation buttons and use the sliders to see the color changes Analogous No. 5/No. 22, Orange and Yellow, by by Mark Rothko Analogous

Selecting colors adjacent to one another on the color wheel creates a scheme of . For example, orange, red-orange, and yellow-orange would be an analogous scheme with a fiery influence. http://websitetips.com/colortools/sitepro/ Analogous

An analogous color scheme can provide a truly harmonious feel to a site with a balanced visual experience. Using one of the colors predominantly will establish a solid base for your site layout, while the partnering colors maintain the soothing appearance. Examples of analogous themes are readily present in nature, from the blue- of the ocean to the red- of natural timber. Such schemes are useful in presenting resource companies as solid and hardworking, or environmental organizations as earthy and resourceful.

http://www.orbitz.com/ Analogous schemes in

Photoshop • In the hue/saturation adjustment dialog box, use the Hue slider and move it to 30 or -30 to get the adjacent colors on the color wheel.

• 60 or -60 for greater variation Complementary

Selecting colors opposite each other on the color wheel creates a scheme of . The opposite of the primary blue, as per the diagram below, is orange. For , 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. Red, Orange, Tan and Purple - Mark Rothko Complementary Colors

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. http://www.ufl.edu/ Complements

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:

In photoshop, split complementary is derived by subtracting and adding 150 to your chosen hue

Double Split complementary Complement Triadic

The triadic approach involves picking from the points of an equilateral triangle within the color wheel.

In photoshop, you subtract or add 120 from the value of the hue References to color web sites

http://www.webweaver.nu/color.shtml

http://www.worqx.com/color/combinations.htm http://www.chainstyle.com/tutorials/colscheme.html