Named color · #F8E3DD
Berry Cheesecake
Berry Cheesecake is #F8E3DD: rgb(248 227 221), hsl(13 66% 92%), oklch(0.931 0.025 36.5). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Gray mean? → · Berry Cheesecake color name →
#F8E3DD
oklch(0.931 0.025 36.5)
Color conversions
- HEX
- #f8e3dd
- RGB
- rgb(248 227 221)
- HSL
- hsl(13 66% 92%)
- HWB
- hwb(13 87% 3%)
- OKLCH
- oklch(0.931 0.025 36.5)
- OKLab
- oklab(0.931 0.02 0.015)
- CIE Lab
- lab(91.84 6.7 5.68)
- LCH
- lch(91.84 8.78 40.3)
- CMYK
- cmyk(0% 8% 11% 3%)
Tints · Shades · Tones
Tints
- F9E6E0
- F9E9E4
- FAEBE7
- FBEEEB
- FCF1EE
- FCF4F1
- FDF7F5
- FEF9F8
- FEFCFC
Shades
- D8C5C0
- B8A8A4
- 9A8C88
- 7C716E
- 605755
- 453F3D
- 2C2726
- 151211
- 030302
Tones
- EBD9D3
- DFCECA
- D3C4C0
- C6BAB7
- BAB0AD
- AEA6A4
- A39D9B
- 979392
- 8B8989
Color harmonies
Complementary +180°
- F8E3DD
Berry Cheesecake
- D7EDF3
≈ Sparkling River
Analogous -30° +30°
- F8E3DD
Berry Cheesecake
- F8E2E5
≈ Poetic Princess
- F4E5D7
≈ Fair Winds
Triadic +120° +240°
- F8E3DD
Berry Cheesecake
- DCEDE2
≈ Sparkling Brook
- E3E7F9
≈ Glitter
Split-complementary +150° +210°
- F8E3DD
Berry Cheesecake
- D7EEEB
≈ Puffy Little Cloud
- DCEAF8
≈ Celestial Cathedral
Tetradic +90° +180° +270°
- F8E3DD
Berry Cheesecake
- E4ECDA
≈ Lime Glow
- D7EDF3
≈ Sparkling River
- ECE4F6
≈ Holographic Lavender
Contrast & accessibility
Ag
FailOn white
WCAG 1.23:1 · APCA Lc 12
Ag
AAAOn black
WCAG 17.02:1 · APCA Lc 92
Best text color: #000000
WCAG 17.02:1 (AAA) · APCA Lc 92
Contrast pairs
Code snippets
CSS
:root {
--berry-cheesecake: #f8e3dd;
--berry-cheesecake-rgb: 248 227 221;
--berry-cheesecake-oklch: oklch(0.931 0.025 36.5);
}
.element {
color: var(--berry-cheesecake);
background-color: hsl(13 66% 92%);
border-color: oklch(0.931 0.025 36.5);
}Tailwind CSS v4
@theme {
--color-berry-cheesecake: #f8e3dd;
--color-berry-cheesecake-50: #fcf3f0;
--color-berry-cheesecake-100: #f0e5e2;
--color-berry-cheesecake-200: #ded1cd;
--color-berry-cheesecake-300: #c3b3ae;
--color-berry-cheesecake-400: #ac9a94;
--color-berry-cheesecake-500: #96817b;
--color-berry-cheesecake-600: #7e6d68;
--color-berry-cheesecake-700: #655753;
--color-berry-cheesecake-800: #4a403d;
--color-berry-cheesecake-900: #342c2a;
--color-berry-cheesecake-950: #1f1917;
}SCSS
$berry-cheesecake: #f8e3dd;
$berry-cheesecake-rgb: 248, 227, 221;
$berry-cheesecake-light: mix(#fff, $berry-cheesecake, 20%);
$berry-cheesecake-dark: mix(#000, $berry-cheesecake, 20%);
.element {
color: $berry-cheesecake;
box-shadow: 0 0 0 2px rgba($berry-cheesecake, 0.35);
}