Foundations

Colors

Color does more than help people see a design. It's a guide to branding, understanding, and overall design perception. We use #212121 as our text color on the background.

Our brand color palette

Color does more than help people see a design. It's a guide to branding, understanding, and overall design perception.

Contrast and shades

When using our colors we try to score at least AA in Web Content Accessibility Guidelines

Kaptio SeaGreen

#034955

#056F82

#69A9B4

#B4D4DA

#E6F1F2

#EFF5F5

#032E36

Fandango Pink

#DE37A4

#EB87C8

#F5C3E4

#FCEBF6

#AF0072

Secondary Colors

When using our colors we try to score at least AA in Web Content Accessibility Guidelines

The Dark Side

#212121

#878787

#C3C3C3

#EBEBEB

#FFFFFF

#F9FAF8

Puffin Beak Orange

#FF6F59

#FFA99B

#FFD4CD

#FFF1EE

#CF1B00

#9C1500

Bumble-Me Yellow

#FFBC42

#FFD78E

#FFEBC6

#FFF8EC

#DC8E00

#976100

Poison Green

#2BA711

#80CA70

#BFE5B8

#EAF6E7

#197C04

Blue

#4285FF

#8EB6FF

#C6DAFF

#ECF5FF

#356CD1

Purple

#6F59FF

#ADA0FF

#D5CFFF

#F1EFFF

#5A47D6

Semantic

Functional colors for system feedback.

Product Layer Accents

Each product layer has a signature color. These sit on top of the shared Forma palette.

Core #056F82

Product Experience #F18525

Edge #DE37A4

Agents #8B5CF6