Named color · #FCDFAF
Apricot Mousse
Apricot Mousse is #FCDFAF: rgb(252 223 175), hsl(37 93% 84%), oklch(0.916 0.07 80.2). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Orange mean? → · Apricot Mousse color name →
#FCDFAF
oklch(0.916 0.07 80.2)
Color conversions
- HEX
- #fcdfaf
- RGB
- rgb(252 223 175)
- HSL
- hsl(37 93% 84%)
- HWB
- hwb(37 69% 1%)
- OKLCH
- oklch(0.916 0.07 80.2)
- OKLab
- oklab(0.916 0.012 0.069)
- CIE Lab
- lab(90.39 5.28 27.47)
- LCH
- lch(90.39 27.97 79.1)
- CMYK
- cmyk(0% 12% 31% 1%)
Tints · Shades · Tones
Tints
- FCE2B7
- FDE6BF
- FDE9C7
- FDECD0
- FEEFD7
- FEF2DF
- FEF6E7
- FFF9EF
- FFFCF7
Shades
- DBC298
- BBA581
- 9C8A6B
- 7E6F56
- 625641
- 473D2E
- 2D271C
- 16120B
- 030201
Tones
- EFD5AA
- E2CBA6
- D5C2A1
- C9B89D
- BCAF98
- B0A593
- A49C8F
- 98928A
- 8C8985
Color harmonies
Complementary +180°
- FCDFAF
Apricot Mousse
- D4E4FF
≈ Veiling Waterfalls
Analogous -30° +30°
- FCDFAF
Apricot Mousse
- FFDBC7
≈ Sugared Peach
- E5E8B2
≈ Iced Celery
Triadic +120° +240°
- FCDFAF
Apricot Mousse
- ACF2F6
≈ Waterspout
- F8D6FF
≈ Pink Diamond
Split-complementary +150° +210°
- FCDFAF
Apricot Mousse
- C2EAFF
≈ Blue Java Banana
- E2DFFF
≈ Stoic White
Tetradic +90° +180° +270°
- FCDFAF
Apricot Mousse
- B5F3DC
≈ Mystery Mint
- D4E4FF
≈ Veiling Waterfalls
- FFD6E8
≈ Pink Currant
Contrast & accessibility
Ag
FailOn white
WCAG 1.28:1 · APCA Lc 14
Ag
AAAOn black
WCAG 16.31:1 · APCA Lc 90
Best text color: #000000
WCAG 16.31:1 (AAA) · APCA Lc 90
Contrast pairs
Code snippets
CSS
:root {
--apricot-mousse: #fcdfaf;
--apricot-mousse-rgb: 252 223 175;
--apricot-mousse-oklch: oklch(0.916 0.07 80.2);
}
.element {
color: var(--apricot-mousse);
background-color: hsl(37 93% 84%);
border-color: oklch(0.916 0.07 80.2);
}Tailwind CSS v4
@theme {
--color-apricot-mousse: #fcdfaf;
--color-apricot-mousse-50: #fff4df;
--color-apricot-mousse-100: #f4e6ce;
--color-apricot-mousse-200: #e3d2b3;
--color-apricot-mousse-300: #c9b58f;
--color-apricot-mousse-400: #b49a6f;
--color-apricot-mousse-500: #9e814f;
--color-apricot-mousse-600: #866d43;
--color-apricot-mousse-700: #6b5736;
--color-apricot-mousse-800: #503f26;
--color-apricot-mousse-900: #372c19;
--color-apricot-mousse-950: #22190a;
}SCSS
$apricot-mousse: #fcdfaf;
$apricot-mousse-rgb: 252, 223, 175;
$apricot-mousse-light: mix(#fff, $apricot-mousse, 20%);
$apricot-mousse-dark: mix(#000, $apricot-mousse, 20%);
.element {
color: $apricot-mousse;
box-shadow: 0 0 0 2px rgba($apricot-mousse, 0.35);
}