Named color · #FBE7E6
Unburdened Pink
Unburdened Pink is #FBE7E6: rgb(251 231 230), hsl(3 72% 94%), oklch(0.944 0.022 21). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Gray mean? → · Unburdened Pink color name →
#FBE7E6
oklch(0.944 0.022 21)
Color conversions
- HEX
- #fbe7e6
- RGB
- rgb(251 231 230)
- HSL
- hsl(3 72% 94%)
- HWB
- hwb(3 90% 2%)
- OKLCH
- oklch(0.944 0.022 21)
- OKLab
- oklab(0.944 0.02 0.008)
- CIE Lab
- lab(93.25 6.92 3.08)
- LCH
- lch(93.25 7.57 24)
- CMYK
- cmyk(0% 8% 8% 2%)
Tints · Shades · Tones
Tints
- FBE9E8
- FCECEB
- FCEEED
- FDF1F0
- FDF3F2
- FEF5F5
- FEF8F7
- FEFAFA
- FFFDFC
Shades
- DAC9C8
- BAABAB
- 9C8F8E
- 7E7373
- 615959
- 464040
- 2D2828
- 151313
- 030303
Tones
- EEDCDB
- E1D2D1
- D5C7C6
- C8BDBC
- BCB2B2
- AFA8A7
- A39E9D
- 979493
- 8C8A8A
Color harmonies
Complementary +180°
- FBE7E6
Unburdened Pink
- DCF1F2
≈ Soar
Analogous -30° +30°
- FBE7E6
Unburdened Pink
- F9E7EE
≈ Hepatica
- F9E9DF
≈ Morning Blush
Triadic +120° +240°
- FBE7E6
Unburdened Pink
- E5F0E3
≈ Molly Green
- E4EDFC
≈ Brilliant White
Split-complementary +150° +210°
- FBE7E6
Unburdened Pink
- DFF1EA
≈ Paradise
- DEEFF9
≈ Wizard White
Tetradic +90° +180° +270°
- FBE7E6
Unburdened Pink
- EDEEDE
≈ Hemlock Bud
- DCF1F2
≈ Soar
- ECEAFA
≈ Bright Dusk
Contrast & accessibility
Ag
FailOn white
WCAG 1.18:1 · APCA Lc 9
Ag
AAAOn black
WCAG 17.67:1 · APCA Lc 95
Best text color: #000000
WCAG 17.67:1 (AAA) · APCA Lc 95
Contrast pairs
Code snippets
CSS
:root {
--unburdened-pink: #fbe7e6;
--unburdened-pink-rgb: 251 231 230;
--unburdened-pink-oklch: oklch(0.944 0.022 21);
}
.element {
color: var(--unburdened-pink);
background-color: hsl(3 72% 94%);
border-color: oklch(0.944 0.022 21);
}Tailwind CSS v4
@theme {
--color-unburdened-pink: #fbe7e6;
--color-unburdened-pink-50: #fbf3f2;
--color-unburdened-pink-100: #efe5e4;
--color-unburdened-pink-200: #ded1d0;
--color-unburdened-pink-300: #c2b3b2;
--color-unburdened-pink-400: #ab9a99;
--color-unburdened-pink-500: #948180;
--color-unburdened-pink-600: #7d6d6c;
--color-unburdened-pink-700: #645756;
--color-unburdened-pink-800: #4a3f3f;
--color-unburdened-pink-900: #332c2c;
--color-unburdened-pink-950: #1f1919;
}SCSS
$unburdened-pink: #fbe7e6;
$unburdened-pink-rgb: 251, 231, 230;
$unburdened-pink-light: mix(#fff, $unburdened-pink, 20%);
$unburdened-pink-dark: mix(#000, $unburdened-pink, 20%);
.element {
color: $unburdened-pink;
box-shadow: 0 0 0 2px rgba($unburdened-pink, 0.35);
}