Named color · #FDFBF8
Cool December
Cool December is #FDFBF8: rgb(253 251 248), hsl(36 56% 98%), oklch(0.989 0.005 78.3). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Gray mean? → · Cool December color name →
#FDFBF8
oklch(0.989 0.005 78.3)
Color conversions
- HEX
- #fdfbf8
- RGB
- rgb(253 251 248)
- HSL
- hsl(36 56% 98%)
- HWB
- hwb(36 97% 1%)
- OKLCH
- oklch(0.989 0.005 78.3)
- OKLab
- oklab(0.989 0.001 0.004)
- CIE Lab
- lab(98.71 0.3 1.69)
- LCH
- lch(98.71 1.71 80)
- CMYK
- cmyk(0% 1% 2% 1%)
Tints · Shades · Tones
Tints
- FDFBF9
- FDFCF9
- FEFCFA
- FEFDFB
- FEFDFB
- FEFDFC
- FEFEFD
- FFFEFE
- FFFFFE
Shades
- DCDAD8
- BCBAB8
- 9D9C9A
- 7F7E7C
- 626160
- 474645
- 2D2D2C
- 161515
- 030303
Tones
- F0EEEB
- E3E1DF
- D6D5D3
- C9C8C6
- BDBCBA
- B0AFAE
- A4A3A2
- 989797
- 8C8C8B
Color harmonies
Complementary +180°
- FDFBF8
Cool December
- F9FBFE
≈ Wash Me
Analogous -30° +30°
- FDFBF8
Cool December
- FEFAF9
≈ Snow
- FBFCF8
≈ Cool December
Triadic +120° +240°
- FDFBF8
Cool December
- F8FCFC
≈ Deutzia White
- FDFAFD
≈ Snowman
Split-complementary +150° +210°
- FDFBF8
Cool December
- F8FCFE
≈ Deutzia White
- FBFBFE
≈ Wash Me
Tetradic +90° +180° +270°
- FDFBF8
Cool December
- F9FCFB
≈ Whiteout
- F9FBFE
≈ Wash Me
- FEFAFC
≈ Snowman
Contrast & accessibility
Ag
FailOn white
WCAG 1.03:1 · APCA Lc 0
Ag
AAAOn black
WCAG 20.33:1 · APCA Lc 105
Best text color: #000000
WCAG 20.33:1 (AAA) · APCA Lc 105
Contrast pairs
Code snippets
CSS
:root {
--cool-december: #fdfbf8;
--cool-december-rgb: 253 251 248;
--cool-december-oklch: oklch(0.989 0.005 78.3);
}
.element {
color: var(--cool-december);
background-color: hsl(36 56% 98%);
border-color: oklch(0.989 0.005 78.3);
}Tailwind CSS v4
@theme {
--color-cool-december: #fdfbf8;
--color-cool-december-50: #f6f5f4;
--color-cool-december-100: #e8e8e6;
--color-cool-december-200: #d5d4d2;
--color-cool-december-300: #b8b7b5;
--color-cool-december-400: #a09e9b;
--color-cool-december-500: #888683;
--color-cool-december-600: #73716f;
--color-cool-december-700: #5c5b59;
--color-cool-december-800: #434241;
--color-cool-december-900: #2e2e2d;
--color-cool-december-950: #1b1a1a;
}SCSS
$cool-december: #fdfbf8;
$cool-december-rgb: 253, 251, 248;
$cool-december-light: mix(#fff, $cool-december, 20%);
$cool-december-dark: mix(#000, $cool-december, 20%);
.element {
color: $cool-december;
box-shadow: 0 0 0 2px rgba($cool-december, 0.35);
}