Hue

Hue is the attribute of a color that allows it to be classified as red, blue, green, etc. It is what most people think of as "color" and represents the dominant wavelength of light that is perceived.

Understanding Hue

Hue is one of the three main properties of color, alongside saturation and lightness/brightness. It is defined by the dominant wavelength of light that is reflected from or transmitted through an object.

• Hue is what distinguishes one color from another (e.g., red from blue)
• It is independent of how light or dark a color is (lightness) or how vivid it is (saturation)
• Hue is the property that gives a color its name

Measuring Hue

In color models like HSL and HSV, hue is represented as a degree on the color wheel from 0° to 360°:

• 0° or 360° represents red
• 60° represents yellow
• 120° represents green
• 180° represents cyan
• 240° represents blue
• 300° represents magenta

This circular arrangement reflects the continuous nature of the color spectrum, where colors blend smoothly from one to the next.

Hue in Different Color Models

HSL (Hue, Saturation, Lightness)

In the HSL color model, hue determines the base color, while saturation and lightness modify its intensity and brightness:

/* HSL examples with varying hue */
hsl(0, 100%, 50%)    /* Red */
hsl(120, 100%, 50%)  /* Green */
hsl(240, 100%, 50%)  /* Blue */

HSV/HSB (Hue, Saturation, Value/Brightness)

Similar to HSL, the HSV model also uses hue as the primary color attribute:

/* HSV examples with varying hue */
hsv(0, 100%, 100%)    /* Red */
hsv(120, 100%, 100%)  /* Green */
hsv(240, 100%, 100%)  /* Blue */

RGB and HEX

In RGB and HEX color models, hue is not directly specified but is determined by the relative values of the red, green, and blue components:

/* RGB examples showing different hues */
rgb(255, 0, 0)    /* Red hue */
rgb(0, 255, 0)    /* Green hue */
rgb(0, 0, 255)    /* Blue hue */

/* HEX examples showing different hues */
#FF0000    /* Red hue */
#00FF00    /* Green hue */
#0000FF    /* Blue hue */

Hue Relationships and Color Harmony

The position of hues on the color wheel defines important color relationships:

• Complementary colors: Hues positioned opposite each other on the color wheel (e.g., red and cyan)
• Analogous colors: Hues adjacent to each other on the color wheel (e.g., blue, blue-purple, and purple)
• Triadic colors: Three hues equally spaced around the color wheel (e.g., red, green, and blue)
• Split-complementary: A hue and the two hues adjacent to its complement

These relationships form the basis of color harmony theory and are essential for effective color scheme design.

Hue Shifting in Design

Designers often use hue shifting techniques to create more interesting and realistic color palettes:

• Temperature shifts: Shifting highlights toward yellow/orange and shadows toward blue/purple
• Atmospheric perspective: Shifting distant objects toward blue to simulate atmospheric effects
• Local color variation: Using slight hue variations to add richness to otherwise flat color areas

Psychological Effects of Hue

Different hues can evoke different psychological and emotional responses:

• Red: Energy, passion, attention, urgency
• Blue: Calm, trust, stability, professionalism
• Green: Nature, growth, freshness, health
• Yellow: Optimism, clarity, warmth, caution
• Purple: Creativity, wisdom, luxury, spirituality

Understanding these associations is crucial for effective color selection in design and branding.