Color
Semantic colors used at Teradata.
Color tokens
The design system uses semantic color tokens that map to different values in light and dark modes. Below are the key categories.
Primary
Token | Light | Dark |
|---|---|---|
primary | cv-theme-palettes.digital-blue-40 | cv-theme-palettes.digital-blue-90 |
primary-container | cv-theme-palettes.digital-blue-94 | cv-theme-palettes.digital-blue-30 |
on-primary | cv-theme-palettes.digital-blue-100 | cv-theme-palettes.digital-blue-20 |
on-primary-container | cv-theme-palettes.digital-blue-10 | cv-theme-palettes.digital-blue-95 |
Secondary
Token | Light | Dark |
|---|---|---|
secondary | cv-theme-palettes.navy-13 | cv-theme-palettes.secondary-80 |
secondary-container | cv-theme-palettes.secondary-90 | cv-theme-palettes.secondary-30 |
on-secondary | cv-theme-palettes.secondary-100 | cv-theme-palettes.secondary-10 |
on-secondary-container | cv-theme-palettes.secondary-10 | cv-theme-palettes.secondary-90 |
Tertiary
Token | Light | Dark |
|---|---|---|
tertiary | cv-theme-palettes.orange-40 | #FF5F02 |
tertiary-container | cv-theme-palettes.orange-90 | cv-theme-palettes.orange-60 |
on-tertiary | cv-theme-palettes.orange-100 | cv-theme-palettes.orange-40 |
on-tertiary-container | cv-theme-palettes.orange-10 | cv-theme-palettes.orange-98 |
Surface
Token | Light | Dark |
|---|---|---|
surface | cv-theme-palettes.neutral-98 | cv-theme-palettes.neutral-10 |
surface-container | cv-theme-palettes.neutral-94 | cv-theme-palettes.neutral-18 |
on-surface | cv-theme-palettes.navy-13 | cv-theme-palettes.neutral-90 |
on-surface-variant | cv-theme-palettes.neutral-30 | cv-theme-palettes.neutral-80 |
Status colors
Token | Light | Dark |
|---|---|---|
positive | cv-theme-palettes.positive-40 | cv-theme-palettes.positive-90 |
negative | cv-theme-palettes.negative-40 | cv-theme-palettes.negative-80 |
caution | cv-theme-palettes.caution-40 | cv-theme-palettes.caution-90 |
emphasis | cv-theme-palettes.emphasis-40 | cv-theme-palettes.emphasis-60 |
Other tokens
Token | Light | Dark |
|---|---|---|
background | cv-theme-palettes.neutral-98 | cv-theme-palettes.neutral-0 |
outline | cv-theme-palettes.neutral-40 | cv-theme-palettes.neutral-50 |
outline-variant | cv-theme-palettes.neutral-80 | cv-theme-palettes.neutral-20 |
logo | #FF5F02 | #FFFFFF |
scrim | #00000052 | #00000052 |