Colors

A collection of Scripps College’s colors. The badges in the lower left indicate if the color is accessible at all sizes for black or white. Hover for more information.

Large Text is defined as 18.5px and bold or 24px.

Primary Colors

Green

#34715B

Pass: Large Text White
Pass: Small Text White
Pass: Large Text Black
Fail: Small Text Black

$color-green

Dark Green

#2B493E

Pass: Large Text White
Pass: Small Text White
Fail: Large Text Black
Fail: Small Text Black

$color-green-dark;

black

#000

Pass: Large Text White
Pass: Small Text White
Fail: Large Text Black
Fail: Small Text Black

$color-black

Secondary Colors

Light Green

#A7C539

Fail: Large Text White
Fail: Small Text White
Pass: Large Text Black
Pass: Small Text Black

$color-green-light

Aqua

#38939B

Pass: Large Text White
Fail: Small Text White
Pass: Large Text Black
Pass: Small Text Black

$color-aqua

Blue

#56A0D3

Fail: Large Text White
Fail: Small Text White
Pass: Large Text Black
Pass: Small Text Black

$color-blue

Dark Blue

#3C61A5

Pass: Large Text White
Pass: Small Text White
Pass: Large Text Black
Fail: Small Text Black

$color-blue-dark

Brown

#8A7967

Pass: Large Text White
Fail: Small Text White
Pass: Large Text Black
Pass: Small Text Black

$color-brown

Purple

#8E8DC3

Pass: Large Text White
Fail: Small Text White
Pass: Large Text Black
Pass: Small Text Black

$color-purple

Magenta

#BD76AC

Pass: Large Text White
Fail: Small Text White
Pass: Large Text Black
Pass: Small Text Black

$color-magenta

Red

#C94D5B

Pass: Large Text White
Fail: Small Text White
Pass: Large Text Black
Pass: Small Text Black

$color-red

Dark Orange

#CF8129

Pass: Large Text White
Fail: Small Text White
Pass: Large Text Black
Pass: Small Text Black

$color-orange-dark

Orange

#F15D22

Pass: Large Text White
Fail: Small Text White
Pass: Large Text Black
Pass: Small Text Black

$color-orange

Light Orange

#EFB067

Fail: Large Text White
Fail: Small Text White
Pass: Large Text Black
Pass: Small Text Black

$color-orange-light

Yellow

#F0CA17

Fail: Large Text White
Fail: Small Text White
Pass: Large Text Black
Pass: Small Text Black

$color-yellow

Neutral Colors

Light Grey

#F2F2F2

Fail: Large Text White
Fail: Small Text White
Pass: Large Text Black
Pass: Small Text Black

$color-grey-light

Grey

#D8D8D8

Fail: Large Text White
Fail: Small Text White
Pass: Large Text Black
Pass: Small Text Black

$color-grey

Dark Grey

#333

Pass: Large Text White
Pass: Small Text White
Fail: Large Text Black
Fail: Small Text Black

$color-grey-dark

Color Usage

Events

Aqua (#38939B) is used as an accent for event badges and links.

News

Yellow (#F0CA17) is used as an accent for news borders and links.

Stories

Red (#C94D5B) is used as an accent for testimonial borders and links.

Highlights

Magenta (#BD76AC) is used as an accent for stats, video highlights and call-outs.

Menus

Dark blue (#3C61A5) is used in the sidebar menu system.