Codecademy Logo

Color in Visual Design

Color Blindness

Color blindness can affect the way people perceive colors. Red-green color blindness makes it difficult to distinguish the difference between red and green colors. Blue-yellow color blindness affects the ability to distinguish the difference between shades of blue and yellow. Total color blindness is the inability to see colors other than white, gray, or black.

Color Contrast

Color contrast is the difference between two colors. The higher the contrast the more the two colors stand out from each other.

Three green rectangles with blue text. The left hand rectangle  has a dark blue text that reads HIGH CONTRAST. The middle rectangle has a blue text that reads MEDIUM CONTRAST. The right hand rectangle has a light blue text that reads LOW CONTRAST

Harmonious Color Relationships

Designers often use harmonious color relationships such as monochromatic, analogous, triadic, and tetradic to create color schemes.

Primary Color

The primary color in UX and UI design, is the dominant color a user will see when using the product. This term, used to differentiate primary, secondary, and accent colors in interface design, is a distinct term from the “primary colors” used to describe the color wheel.

Accent Color

Accent colors are used to emphasize sections, actions or text on an interface.


Color is used in visual design to communicate messages, evoke emotions, and create visual interest. It is an integral part of the visual design in many different mediums.

Web Content Accessibility Guidelines

The Web Content Accessibility Guidelines is a document that covers a wide range of recommendations for making Web content more accessible.

Secondary Color

The secondary colors in UI and UX design typically complement the primary colors and are used for secondary information in a design. This is a distinct term from the secondary colors used to describe the color wheel.


A color’s hue is the pure color, without any added white or black pigment.


Saturation is the measure of the intensity of a hue, measured from 0%, grayscale, to 100%, pure, vivid hue.

Learn More on Codecademy