Foundation 02 — Color 15 tokens · blue-forward palette

Color, measured.

Navy and light blues carry the brand. Teal ties back to the logo ring. Pink and yellow come from the logo stripes — pink appears at most once per page, yellow essentially never outside the mark itself.

Core ink.

Navy is the brand. White is the canvas. Everything else supports.

#001452

Navy 900

Primary ink. All display headlines. Logo background.

#182A6B

Navy 700

Secondary navy

#3A559A

Navy 500

Mid tile fill

#FFFFFF

White

Default surface

Blue family.

The primary expressive color. Use the deep end for surfaces, the pale end for tints behind copy.

#4A87D6

Blue 600

#6EA6E3

Blue 500

#9EC5EC

Blue 300

#C5DEF3

Blue 200

#E5EFF9

Blue 100

#F2F7FC

Blue 050

Teal & mint.

The brand's quieter side. Teal echoes the logo ring; mint backs anything labelled "active engagement".

#28A58A

Teal 600

#5CBA9E

Teal 500

#A8DAC8

Teal 300

#C9E4D9

Mint 200

#E2F0EA

Mint 100

—

reserved

Accent stripes.

Pink and yellow live in the logo. Pink can earn its way out — yellow cannot.

#E6357B

Pink 500

Logo stripe · one CTA per page · mid-sentence emphasis

#F7C6D9

Pink 200

Soft pink tile

#F5C836

Yellow 400

Logo stripe only — do not use elsewhere

#F7F9FC

Page soft

A warmer alternative to pure white

Combinations that work.

Three pairings cover most of the system. Stick to these and the brand stays itself.

Navy on white.

The default. Headlines, body, the dominant 80% of every page.

Navy on blue 100.

Section dividers, callouts, the "becoming a sustainable program" rail.

Navy on mint 100.

Active engagements, success states, anything that says this is moving.

Pink as one moment.

A single word, a single button — and only when it earns the spotlight.

The rules.

Three principles keep the system from drifting.

DO · 01

One pink per page.

Reserve pink for the single most important CTA, or one mid-sentence emphasis. If you want two pinks, you've actually got zero.

DO · 02

Lead with navy.

If a layout works in navy on white before color is added, the color will land. If it doesn't, color won't fix it.

DON'T · 03

Don't gradient.

Flat fills only. Color combinations come from putting two flat tints next to each other — never from blending them.