Named color · #FCB4D5
Lavender Candy
Lavender Candy is #FCB4D5: rgb(252 180 213), hsl(333 92% 85%), oklch(0.847 0.093 350.2). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Pink mean? → · Lavender Candy color name →
#FCB4D5
oklch(0.847 0.093 350.2)
Color conversions
- HEX
- #fcb4d5
- RGB
- rgb(252 180 213)
- HSL
- hsl(333 92% 85%)
- HWB
- hwb(333 71% 1%)
- OKLCH
- oklch(0.847 0.093 350.2)
- OKLab
- oklab(0.847 0.092 -0.016)
- CIE Lab
- lab(80.97 30.43 -5.71)
- LCH
- lch(80.97 30.96 349.4)
- CMYK
- cmyk(0% 29% 15% 1%)
Tints · Shades · Tones
Tints
- FDBCD9
- FEC3DD
- FECBE1
- FFD2E6
- FFDAEA
- FFE1EE
- FFE9F2
- FFF0F7
- FFF8FB
Shades
- DB9CB9
- BB859E
- 9C6E83
- 7E586A
- 624451
- 47303A
- 2D1D24
- 160C10
- 030202
Tones
- EFAFCC
- E3AAC3
- D6A5BB
- CA9FB2
- BD9AAA
- B195A1
- A59099
- 988B90
- 8C8588
Color harmonies
Complementary +180°
- FCB4D5
Lavender Candy
- 8CE1C4
≈ Clean Green
Analogous -30° +30°
- FCB4D5
Lavender Candy
- E8B9F3
≈ Lovecloud
- FFB7B6
≈ Young Salmon
Triadic +120° +240°
- FCB4D5
Lavender Candy
- D0D38B
≈ Guacamole Ambrosia
- 8BD8FE
≈ Tranquil Pool
Split-complementary +150° +210°
- FCB4D5
Lavender Candy
- ACDCA2
≈ Witty Green
- 7DDFE5
≈ Turkish Turquoise
Tetradic +90° +180° +270°
- FCB4D5
Lavender Candy
- EDC686
≈ Garbanzo Paste
- 8CE1C4
≈ Clean Green
- B0CEFF
≈ Night Snow
Contrast & accessibility
Ag
FailOn white
WCAG 1.66:1 · APCA Lc 29
Ag
AAAOn black
WCAG 12.62:1 · APCA Lc 74
Best text color: #000000
WCAG 12.62:1 (AAA) · APCA Lc 74
Contrast pairs
Code snippets
CSS
:root {
--lavender-candy: #fcb4d5;
--lavender-candy-rgb: 252 180 213;
--lavender-candy-oklch: oklch(0.847 0.093 350.2);
}
.element {
color: var(--lavender-candy);
background-color: hsl(333 92% 85%);
border-color: oklch(0.847 0.093 350.2);
}Tailwind CSS v4
@theme {
--color-lavender-candy: #fcb4d5;
--color-lavender-candy-50: #ffebf8;
--color-lavender-candy-100: #ffdceb;
--color-lavender-candy-200: #f5c5d8;
--color-lavender-candy-300: #dea4bc;
--color-lavender-candy-400: #c988a6;
--color-lavender-candy-500: #b46c8f;
--color-lavender-candy-600: #985b79;
--color-lavender-candy-700: #7a4961;
--color-lavender-candy-800: #5a3548;
--color-lavender-candy-900: #3f2432;
--color-lavender-candy-950: #28131e;
}SCSS
$lavender-candy: #fcb4d5;
$lavender-candy-rgb: 252, 180, 213;
$lavender-candy-light: mix(#fff, $lavender-candy, 20%);
$lavender-candy-dark: mix(#000, $lavender-candy, 20%);
.element {
color: $lavender-candy;
box-shadow: 0 0 0 2px rgba($lavender-candy, 0.35);
}