Named color · #F0CFE1
Lacquer Mauve
Lacquer Mauve is #F0CFE1: rgb(240 207 225), hsl(327 52% 88%), oklch(0.887 0.044 344). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Pink mean? → · Lacquer Mauve color name →
#F0CFE1
oklch(0.887 0.044 344)
Color conversions
- HEX
- #f0cfe1
- RGB
- rgb(240 207 225)
- HSL
- hsl(327 52% 88%)
- HWB
- hwb(327 81% 6%)
- OKLCH
- oklch(0.887 0.044 344)
- OKLab
- oklab(0.887 0.042 -0.012)
- CIE Lab
- lab(86.35 14.13 -4.42)
- LCH
- lch(86.35 14.81 342.6)
- CMYK
- cmyk(0% 14% 6% 6%)
Tints · Shades · Tones
Tints
- F2D4E4
- F3D9E7
- F5DDEA
- F6E2ED
- F8E7F0
- F9ECF3
- FBF1F6
- FCF5F9
- FEFAFC
Shades
- D1B4C4
- B299A7
- 957F8B
- 786770
- 5D4F56
- 43383E
- 2A2327
- 141012
- 030202
Tones
- E4C7D7
- D9BFCD
- CDB7C3
- C2AFB9
- B7A7AF
- AB9FA6
- A0979C
- 968F93
- 8B8889
Color harmonies
Complementary +180°
- F0CFE1
Lacquer Mauve
- C1E4D2
≈ Beru
Analogous -30° +30°
- F0CFE1
Lacquer Mauve
- E5D2EF
≈ Lavender Princess
- F5CFD1
≈ Strawberry Ripple
Triadic +120° +240°
- F0CFE1
Lacquer Mauve
- DEDCBB
≈ Endless Silk
- BCE1F0
≈ Diminished Blue
Split-complementary +150° +210°
- F0CFE1
Lacquer Mauve
- CEE1C4
≈ Soft Moss
- BAE4E2
≈ Bleached Aqua
Tetradic +90° +180° +270°
- F0CFE1
Lacquer Mauve
- ECD6BB
≈ Speckled Eggs
- C1E4D2
≈ Beru
- C7DCF7
≈ Fly a Kite
Contrast & accessibility
Ag
FailOn white
WCAG 1.42:1 · APCA Lc 20
Ag
AAAOn black
WCAG 14.71:1 · APCA Lc 83
Best text color: #000000
WCAG 14.71:1 (AAA) · APCA Lc 83
Contrast pairs
Code snippets
CSS
:root {
--lacquer-mauve: #f0cfe1;
--lacquer-mauve-rgb: 240 207 225;
--lacquer-mauve-oklch: oklch(0.887 0.044 344);
}
.element {
color: var(--lacquer-mauve);
background-color: hsl(327 52% 88%);
border-color: oklch(0.887 0.044 344);
}Tailwind CSS v4
@theme {
--color-lacquer-mauve: #f0cfe1;
--color-lacquer-mauve-50: #fff0f8;
--color-lacquer-mauve-100: #f4e2eb;
--color-lacquer-mauve-200: #e3cdd8;
--color-lacquer-mauve-300: #c9afbc;
--color-lacquer-mauve-400: #b295a5;
--color-lacquer-mauve-500: #9c7b8d;
--color-lacquer-mauve-600: #846878;
--color-lacquer-mauve-700: #6a5360;
--color-lacquer-mauve-800: #4d3d47;
--color-lacquer-mauve-900: #362a31;
--color-lacquer-mauve-950: #21171d;
}SCSS
$lacquer-mauve: #f0cfe1;
$lacquer-mauve-rgb: 240, 207, 225;
$lacquer-mauve-light: mix(#fff, $lacquer-mauve, 20%);
$lacquer-mauve-dark: mix(#000, $lacquer-mauve, 20%);
.element {
color: $lacquer-mauve;
box-shadow: 0 0 0 2px rgba($lacquer-mauve, 0.35);
}