Named color · #F4E2D9
Sitting Pretty
Sitting Pretty is #F4E2D9: rgb(244 226 217), hsl(20 55% 90%), oklch(0.925 0.023 48.5). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Gray mean? → · Sitting Pretty color name →
#F4E2D9
oklch(0.925 0.023 48.5)
Color conversions
- HEX
- #f4e2d9
- RGB
- rgb(244 226 217)
- HSL
- hsl(20 55% 90%)
- HWB
- hwb(20 85% 4%)
- OKLCH
- oklch(0.925 0.023 48.5)
- OKLab
- oklab(0.925 0.015 0.017)
- CIE Lab
- lab(91.17 5.26 6.75)
- LCH
- lch(91.17 8.56 52)
- CMYK
- cmyk(0% 7% 11% 4%)
Tints · Shades · Tones
Tints
- F5E5DD
- F6E8E1
- F7EBE4
- F9EEE8
- FAF0EC
- FBF3F0
- FCF6F4
- FDF9F7
- FEFCFB
Shades
- D4C4BC
- B5A8A1
- 978C86
- 7A716C
- 5E5753
- 443E3B
- 2B2725
- 141211
- 030302
Tones
- E8D8D0
- DCCEC7
- D0C4BD
- C4BAB4
- B8B0AB
- ADA6A3
- A19C9A
- 969391
- 8B8989
Color harmonies
Complementary +180°
- F4E2D9
Sitting Pretty
- D7EAF3
≈ Spacious Skies
Analogous -30° +30°
- F4E2D9
Sitting Pretty
- F5E0E0
≈ Hint of Red
- EFE5D5
≈ Stone Pillar
Triadic +120° +240°
- F4E2D9
Sitting Pretty
- D8EBE3
≈ Green Emulsion
- E5E4F5
≈ Lavender Mist
Split-complementary +150° +210°
- F4E2D9
Sitting Pretty
- D5EBEC
≈ Water Squirt
- DDE7F6
≈ St. Petersburg
Tetradic +90° +180° +270°
- F4E2D9
Sitting Pretty
- DFEADB
≈ Mint Emulsion
- D7EAF3
≈ Spacious Skies
- EDE2F0
≈ Faded Fuchsia
Contrast & accessibility
Ag
FailOn white
WCAG 1.25:1 · APCA Lc 13
Ag
AAAOn black
WCAG 16.72:1 · APCA Lc 91
Best text color: #000000
WCAG 16.72:1 (AAA) · APCA Lc 91
Contrast pairs
Code snippets
CSS
:root {
--sitting-pretty: #f4e2d9;
--sitting-pretty-rgb: 244 226 217;
--sitting-pretty-oklch: oklch(0.925 0.023 48.5);
}
.element {
color: var(--sitting-pretty);
background-color: hsl(20 55% 90%);
border-color: oklch(0.925 0.023 48.5);
}Tailwind CSS v4
@theme {
--color-sitting-pretty: #f4e2d9;
--color-sitting-pretty-50: #fbf3ef;
--color-sitting-pretty-100: #efe6e1;
--color-sitting-pretty-200: #ddd2cc;
--color-sitting-pretty-300: #c2b4ad;
--color-sitting-pretty-400: #ab9b93;
--color-sitting-pretty-500: #948279;
--color-sitting-pretty-600: #7d6e67;
--color-sitting-pretty-700: #645852;
--color-sitting-pretty-800: #4a403c;
--color-sitting-pretty-900: #332c29;
--color-sitting-pretty-950: #1f1917;
}SCSS
$sitting-pretty: #f4e2d9;
$sitting-pretty-rgb: 244, 226, 217;
$sitting-pretty-light: mix(#fff, $sitting-pretty, 20%);
$sitting-pretty-dark: mix(#000, $sitting-pretty, 20%);
.element {
color: $sitting-pretty;
box-shadow: 0 0 0 2px rgba($sitting-pretty, 0.35);
}