Color Use

Full value and tint use

Each color in the color palette comes in three values: full value, medium tint, and light tint. Avoid using tints not included in the palette.

 

Color resources

Use the buttons below to download our color palette in Adobe Swatch Exchange format for digital and print use as well as the guide for appropriate color use.

  • Full value swatch

    Full value

    For use on white. Pairs well with medium or light tints. Do not use too many full value colors in one application. It can appear childish or circus-like.

  • Medium tint swatch

    Medium tint

    Pairs well with full value color backgrounds.

  • Light tint swatch

    Light tint

    Adds sophistication and extends palette options

DO!

Full value colors (excluding Yellow) can be used for text on white backgrounds. Using medium or light tint text on full value backgrounds does meet ADA readability requirements. Visa-versa is alright too!

 
Text on full value on white background
Full value background color and medium tint text
Text on medium tint on white background
 
Full value background and medium tint text
Light tint background color (especially neutral) and full value text
 

DON’T!

Full value colors should not be used for text on a full value or medium tint background colors. This does not meet ADA readability requirements for online text.

Light tint text on white backgrounds is also unacceptable.

 
Inappropriate use of full value background color and full value text
Inappropriate use of medium tint background color and full value text
Inappropriate use of light tint text on white background color
 

Palette formula builder

Use this formula to build color palettes. This allows for the maximum number of colors to be used in an application. Note that the use of secondary colors are optional, and the use of tints allows for great flexibility. Often times a limited color palette can be more impactful than a larger palette.

 
Primary navy and purple full value and tint swatches

Choose 1 primary brand color

Tints may be included.

 

+

 
secondary full value and tint swatches

(Optional)
Choose 1 secondary color

Tints may be included.

 

+

 
Secondary medium and light tints

(Optional)
Choose 2 additional secondary or neutral tints

 

Palette formula builder examples

A young girl bounces on a ball in front of a purple background with the headline "Move your body. Move your world."

Palette formula

Primary purple full value and tint swatches

Full value purple
(photo colorization inspired by tints)

 
Infographic showing school lunch statistics with the headline "Huge progress and support for healthy school meals."

Palette formula

Full value purple swatch

Full value purple

Full value teal swatch

Full value teal

Medium tint green and medium tint orange swatches

Medium tints green and orange

Illustration of different environments in reds and teals making up a white cross in the center

Palette formula

Full value navy swatch

Full value navy

Full value and medium tint teal swatches

Full value and medium tint teal

Full value and medium tint red swatches

Full value and medium tint red

Illustration of hands in various tints of blue holding seedlings

Palette formula

Full value and medium and light tints of navy swatches

Full value navy (tints included)

Full value green and medium and light tints swatches

Full value green (tints included)

Medium tint yellow swatch and light tint red swatches

Medium tint yellow light tint red

 

Color resources

Use the buttons below to download our color palette in Adobe Swatch Exchange format for digital and print use as well as the guide for appropriate color use.