Named color · #F7BFC2
Candy Cane
Candy Cane is #F7BFC2: rgb(247 191 194), hsl(357 78% 86%), oklch(0.856 0.065 14.9). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Pink mean? → · Candy Cane color name →
#F7BFC2
oklch(0.856 0.065 14.9)
Color conversions
- HEX
- #f7bfc2
- RGB
- rgb(247 191 194)
- HSL
- hsl(357 78% 86%)
- HWB
- hwb(357 75% 3%)
- OKLCH
- oklch(0.856 0.065 14.9)
- OKLab
- oklab(0.856 0.062 0.017)
- CIE Lab
- lab(82.55 21.02 6.65)
- LCH
- lch(82.55 22.05 17.6)
- CMYK
- cmyk(0% 23% 21% 3%)
Tints · Shades · Tones
Tints
- F8C5C8
- F9CCCE
- FAD2D4
- FBD9DA
- FCDFE0
- FDE5E6
- FEECEC
- FEF2F3
- FFF9F9
Shades
- D7A6A8
- B78D8F
- 997577
- 7C5E60
- 604849
- 453334
- 2C1F20
- 150D0E
- 030202
Tones
- EBB9BB
- DFB2B4
- D2ACAE
- C6A6A7
- BB9FA0
- AF999A
- A39393
- 978C8D
- 8C8686
Color harmonies
Complementary +180°
- F7BFC2
Candy Cane
- 9DDDDC
≈ Pale Pastel
Analogous -30° +30°
- F7BFC2
Candy Cane
- F0BFD9
≈ Parrot Tulip
- F5C3AD
≈ Cosmetic Peach
Triadic +120° +240°
- F7BFC2
Candy Cane
- BEDAAF
≈ Winter Willow Green
- B4D2FA
≈ Ice Cold Stare
Split-complementary +150° +210°
- F7BFC2
Candy Cane
- A8DEC5
≈ Mountain Mint
- A2D9F0
≈ Sora Blue
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
FailOn white
WCAG 1.59:1 · APCA Lc 27
Ag
AAAOn black
WCAG 13.18:1 · APCA Lc 76
Best text color: #000000
WCAG 13.18:1 (AAA) · APCA Lc 76
Contrast pairs
Code snippets
CSS
:root {
--candy-cane: #f7bfc2;
--candy-cane-rgb: 247 191 194;
--candy-cane-oklch: oklch(0.856 0.065 14.9);
}
.element {
color: var(--candy-cane);
background-color: hsl(357 78% 86%);
border-color: oklch(0.856 0.065 14.9);
}Tailwind CSS v4
@theme {
--color-candy-cane: #f7bfc2;
--color-candy-cane-50: #ffeeee;
--color-candy-cane-100: #fde0e0;
--color-candy-cane-200: #efcaca;
--color-candy-cane-300: #d7abac;
--color-candy-cane-400: #c28f92;
--color-candy-cane-500: #ad7578;
--color-candy-cane-600: #926366;
--color-candy-cane-700: #754f51;
--color-candy-cane-800: #56393c;
--color-candy-cane-900: #3c2729;
--color-candy-cane-950: #261517;
}SCSS
$candy-cane: #f7bfc2;
$candy-cane-rgb: 247, 191, 194;
$candy-cane-light: mix(#fff, $candy-cane, 20%);
$candy-cane-dark: mix(#000, $candy-cane, 20%);
.element {
color: $candy-cane;
box-shadow: 0 0 0 2px rgba($candy-cane, 0.35);
}