Named color · #D10929
Cardinal Rage
Cardinal Rage is #D10929: rgb(209 9 41), hsl(350 92% 43%), oklch(0.545 0.217 23.8). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Red mean? → · Cardinal Rage color name →
#D10929
oklch(0.545 0.217 23.8)
Color conversions
- HEX
- #d10929
- RGB
- rgb(209 9 41)
- HSL
- hsl(350 92% 43%)
- HWB
- hwb(350 4% 18%)
- OKLCH
- oklch(0.545 0.217 23.8)
- OKLab
- oklab(0.545 0.199 0.088)
- CIE Lab
- lab(44.96 69.2 42.78)
- LCH
- lch(44.96 81.36 31.7)
- CMYK
- cmyk(0% 96% 80% 18%)
Tints · Shades · Tones
Tints
- D93A40
- E15655
- E76E6A
- ED847F
- F39993
- F7AEA8
- FAC2BE
- FDD6D3
- FEEBE9
Shades
- B50722
- 9B051C
- 810315
- 68020F
- 500109
- 390105
- 230002
- 100001
- 020000
Tones
- CB2A34
- C43B3E
- BE4847
- B75350
- AF5C58
- A76561
- 9F6C69
- 957370
- 8B7A78
Color harmonies
Complementary +180°
- D10929
Cardinal Rage
- 007F89
≈ Go Alpha
Analogous -30° +30°
- D10929
Cardinal Rage
- C61179
≈ Bottom of My Heart
- AB5500
≈ Tijolo
Triadic +120° +240°
- D10929
Cardinal Rage
- 008817
≈ Lush Garden
- 2961EC
≈ Retro Blue
Split-complementary +150° +210°
- D10929
Cardinal Rage
- 00836B
≈ Viridis
- 007AA8
≈ Quiet Cove
Tetradic +90° +180° +270°
- D10929
Cardinal Rage
- 707700
≈ Portuguese Green
- 007F89
≈ Go Alpha
- 7C47DF
≈ Aconite Purple
Contrast & accessibility
Ag
AAOn white
WCAG 5.55:1 · APCA Lc 75
Ag
FailOn black
WCAG 3.78:1 · APCA Lc 27
Best text color: #FFFFFF
WCAG 5.55:1 (AA) · APCA Lc 75
Contrast pairs
Code snippets
CSS
:root {
--cardinal-rage: #d10929;
--cardinal-rage-rgb: 209 9 41;
--cardinal-rage-oklch: oklch(0.545 0.217 23.8);
}
.element {
color: var(--cardinal-rage);
background-color: hsl(350 92% 43%);
border-color: oklch(0.545 0.217 23.8);
}Tailwind CSS v4
@theme {
--color-cardinal-rage: #d10929;
--color-cardinal-rage-50: #ffded5;
--color-cardinal-rage-100: #ffccc2;
--color-cardinal-rage-200: #ffaea4;
--color-cardinal-rage-300: #ff857c;
--color-cardinal-rage-400: #ff5b5c;
--color-cardinal-rage-500: #f51e37;
--color-cardinal-rage-600: #cf1f2f;
--color-cardinal-rage-700: #a61a26;
--color-cardinal-rage-800: #7d0f1d;
--color-cardinal-rage-900: #580a13;
--color-cardinal-rage-950: #3b0005;
}SCSS
$cardinal-rage: #d10929;
$cardinal-rage-rgb: 209, 9, 41;
$cardinal-rage-light: mix(#fff, $cardinal-rage, 20%);
$cardinal-rage-dark: mix(#000, $cardinal-rage, 20%);
.element {
color: $cardinal-rage;
box-shadow: 0 0 0 2px rgba($cardinal-rage, 0.35);
}