Color

Keeping our colors consistent is crucial in maintaining the integrity of our brand. This means that every web page, social graphic, and print material should abide by our color hierarchy. If you're unsure which color to use, ask someone on the design team.

For print materials, please use the provided PMS colors.

Primary COlors

Copied! Copy Hex Code Primary Pink |

Copied! Copy Hex Code Brown |

Copied! Copy Hex Code White |

Copied! Copy Hex Code Secondary Teal |

Copied! Copy Hex Code Copy Gray |

Primary Pink is our main brand color and can be used in almost any application - text color, background color, or to provide any sort of pop or accent.
Brown should be the primary color used for headings. In addition, it also works well as a background color.
White is our main background color, as it allows for our messaging and colors to stand out.
Secondary Teal should be reserved for call to actions, such as buttons or text links.
Copy Gray should be used predominantly for body copy text.

Full Color Palette

Some colors below feature a dark and light variation. These variations are primarily for web use, such as when you hover over a button or text link.

Copied! Copy Hex Code

Primary Pink - Dark

HEX:

SCSS: $color-primary-d

PMS: Not for print

Copied! Copy Hex Code

Primary Pink

HEX:

SCSS: $color-primary

PMS: PANTONE 7423 C

Copied! Copy Hex Code

Primary Pink - Light

HEX:

SCSS: $color-primary-l

PMS: Not for print

Copied! Copy Hex Code

Secondary Teal - Dark

HEX:

SCSS: $color-secondary-d

PMS: Not for print

Copied! Copy Hex Code

Secondary Teal

HEX:

SCSS: $color-secondary

PMS: PANTONE 310 C

Copied! Copy Hex Code

Secondary Teal - Light

HEX:

SCSS: $color-secondary-l

PMS: Not for print

Copied! Copy Hex Code

Brown

HEX:

SCSS: $color-bg-dark

PMS: PANTONE 439 C

Copied! Copy Hex Code

Light Gray

HEX:

SCSS: $color-bg-light

PMS: Not for print

Copied! Copy Hex Code

Copy Gray

HEX:

SCSS: $color-tx

PMS: PANTONE 424 C

Copied! Copy Hex Code

Accent Gray

HEX:

SCSS: $color-bdr

PMS: PANTONE 427 C

Copied! Copy Hex Code

White

HEX:

SCSS: N/A

PMS: N/A