Nearest named color · #FFDCD4
#FFDCD4
Nearest named color: Bloodthirsty Beige
#FFDCD4 (rgb(255 220 212), hsl(11 100% 92%), oklch(0.921 0.041 33)) is closest to the named color Bloodthirsty Beige. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#FFDCD4
oklch(0.921 0.041 33)
Color conversions
- HEX
- #ffdcd4
- RGB
- rgb(255 220 212)
- HSL
- hsl(11 100% 92%)
- HWB
- hwb(11 83% 0%)
- OKLCH
- oklch(0.921 0.041 33)
- OKLab
- oklab(0.921 0.034 0.022)
- CIE Lab
- lab(90.57 11.61 8.66)
- LCH
- lch(90.57 14.48 36.7)
- CMYK
- cmyk(0% 14% 17% 0%)
Tints · Shades · Tones
Tints
- FFE0D8
- FFE3DD
- FFE7E1
- FFEAE5
- FFEEE9
- FFF1EE
- FFF5F2
- FFF8F6
- FFFCFB
Shades
- DEBFB8
- BEA39D
- 9E8883
- 806E69
- 635451
- 483C3A
- 2E2624
- 161110
- 030202
Tones
- F2D2CB
- E5C9C3
- D7C0BA
- CBB6B2
- BEADA9
- B1A4A1
- A59B98
- 989290
- 8C8988
Color harmonies
Complementary +180°
- FFDCD4
Bloodthirsty Beige
- C7EDF5
≈ Frosty Day
Analogous -30° +30°
- FFDCD4
Bloodthirsty Beige
- FEDAE2
≈ It’s a Girl!
- F9E0CA
≈ Peachade
Triadic +120° +240°
- FFDCD4
Bloodthirsty Beige
- D2EDD9
≈ Jade Palace
- DCE4FF
≈ Stoic White
Split-complementary +150° +210°
- FFDCD4
Bloodthirsty Beige
- C8EEE7
≈ Whisper of Grass
- CFE9FF
≈ Veiling Waterfalls
Tetradic +90° +180° +270°
- FFDCD4
Bloodthirsty Beige
- E0EACD
≈ Whiff of Green
- C7EDF5
≈ Frosty Day
- EADFFC
≈ Lavender Savour
Contrast & accessibility
Ag
FailOn white
WCAG 1.27:1 · APCA Lc 14
Ag
AAAOn black
WCAG 16.43:1 · APCA Lc 90
Best text color: #000000
WCAG 16.43:1 (AAA) · APCA Lc 90
Contrast pairs
Code snippets
CSS
:root {
--bloodthirsty-beige: #ffdcd4;
--bloodthirsty-beige-rgb: 255 220 212;
--bloodthirsty-beige-oklch: oklch(0.921 0.041 33);
}
.element {
color: var(--bloodthirsty-beige);
background-color: hsl(11 100% 92%);
border-color: oklch(0.921 0.041 33);
}Tailwind CSS v4
@theme {
--color-bloodthirsty-beige: #ffdcd4;
--color-bloodthirsty-beige-50: #fff1ed;
--color-bloodthirsty-beige-100: #f5e3df;
--color-bloodthirsty-beige-200: #e5cfc9;
--color-bloodthirsty-beige-300: #cbb1aa;
--color-bloodthirsty-beige-400: #b5968f;
--color-bloodthirsty-beige-500: #9f7d75;
--color-bloodthirsty-beige-600: #876a63;
--color-bloodthirsty-beige-700: #6c544f;
--color-bloodthirsty-beige-800: #503d3a;
--color-bloodthirsty-beige-900: #372a28;
--color-bloodthirsty-beige-950: #221816;
}SCSS
$bloodthirsty-beige: #ffdcd4;
$bloodthirsty-beige-rgb: 255, 220, 212;
$bloodthirsty-beige-light: mix(#fff, $bloodthirsty-beige, 20%);
$bloodthirsty-beige-dark: mix(#000, $bloodthirsty-beige, 20%);
.element {
color: $bloodthirsty-beige;
box-shadow: 0 0 0 2px rgba($bloodthirsty-beige, 0.35);
}