Vital Pulse
A complete five-role scheme. energetic and bold in character — tagged for fitness.
primary
#d13a26 secondary
#f28d7d accent
#14213d background
#fefaf8 text
#2c130d AcmeSign up
Ship your next idea faster
Everything you need to launch, in one place.
Get started Learn moreOpen this scheme in the Studio →
Color values
| Role | Hex | RGB | HSL |
|---|---|---|---|
| primary | #d13a26 | 209, 58, 38 | 7°, 69%, 48% |
| secondary | #f28d7d | 242, 141, 125 | 8°, 82%, 72% |
| accent | #14213d | 20, 33, 61 | 221°, 51%, 16% |
| background | #fefaf8 | 254, 250, 248 | 20°, 75%, 98% |
| text | #2c130d | 44, 19, 13 | 12°, 54%, 11% |
Contrast (WCAG)
| Pair | Ratio | Level |
|---|---|---|
| text on background | 16.79 | AAA |
| primary on background | 4.66 | AA |
| secondary on background | 2.28 | fail |
| accent on background | 15.40 | AAA |
| background on primary | 4.66 | AA |
| background on accent | 15.40 | AAA |
CSS variables
:root {
--color-primary: #d13a26;
--color-secondary: #f28d7d;
--color-accent: #14213d;
--color-bg: #fefaf8;
--color-text: #2c130d;
}Tailwind
colors: {
primary: '#d13a26',
secondary: '#f28d7d',
accent: '#14213d',
background: '#fefaf8',
text: '#2c130d',
}