Color distinguishes our brand and helps us create consistent experiences across products.
Primary Color Palette
| Name | Blue |
|---|---|
| Type | Primary |
| HEX | #1573a6 |
| CSS Variable | var(--primary) |
| Usage |
Accent Color Palette
| Name | Teal |
|---|---|
| Type | Accent |
| HEX | #168381 |
| CSS Variable | var(--accent-1) |
| Usage |
| Name | Royal Blue |
|---|---|
| Type | Accent |
| HEX | #2b2b5c |
| CSS Variable | var(--accent-2) |
| Usage |
| Name | Tan |
|---|---|
| Type | Accent |
| HEX | #ede8de |
| CSS Variable | var(--accent-3) |
| Usage |
| Name | Dark Blue |
|---|---|
| Type | Accent |
| HEX | #151538 |
| CSS Variable | var(--accent-4) |
| Usage |
Extended Color Palette
| Name | Dark Gray |
|---|---|
| Type | Shade |
| HEX | #595353 |
| CSS Variable | var(--dark-gray-1) |
| Usage |
| Name | Light Gray |
|---|---|
| Type | Shade |
| HEX | #eaeaea |
| CSS Variable | var(--light-gray-1) |
| Usage |
| Name | Black |
|---|---|
| Type | Shade |
| HEX | #040404 |
| CSS Variable | var(--black) |
| Usage |
Color Crimes
Don't
Use unapproved colors.