Named color · #F2C2E1
Rosy Nectar
Rosy Nectar is #F2C2E1: rgb(242 194 225), hsl(321 65% 85%), oklch(0.865 0.068 339.7). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Pink mean? → · Rosy Nectar color name →
#F2C2E1
oklch(0.865 0.068 339.7)
Color conversions
- HEX
- #f2c2e1
- RGB
- rgb(242 194 225)
- HSL
- hsl(321 65% 85%)
- HWB
- hwb(321 76% 5%)
- OKLCH
- oklch(0.865 0.068 339.7)
- OKLab
- oklab(0.865 0.064 -0.023)
- CIE Lab
- lab(83.44 21.32 -8.64)
- LCH
- lch(83.44 23.01 337.9)
- CMYK
- cmyk(0% 20% 7% 5%)
Tints · Shades · Tones
Tints
- F4C8E4
- F5CEE7
- F7D4EA
- F8DAED
- F9E0F0
- FBE7F3
- FCEDF6
- FDF3F9
- FEF9FC
Shades
- D2A8C4
- B48FA7
- 96778B
- 796070
- 5E4956
- 43343E
- 2B2027
- 140E12
- 030202
Tones
- E6BBD7
- DAB5CD
- CFAEC3
- C3A7B9
- B8A1AF
- AD9AA6
- A1939C
- 968D93
- 8B8689
Color harmonies
Complementary +180°
- F2C2E1
Rosy Nectar
- ADE1C3
≈ Mountain Mint
Analogous -30° +30°
- F2C2E1
Rosy Nectar
- E0C7F5
≈ Foggy Heath
- FBC1C9
≈ Rose Shadow
Triadic +120° +240°
- F2C2E1
Rosy Nectar
- DDD4A1
≈ Woven
- A1DEF2
≈ Non-Photo Blue
Split-complementary +150° +210°
- F2C2E1
Rosy Nectar
- C4DCAD
≈ Bowling Green
- 9FE2DC
≈ Spinnaker
Tetradic +90° +180° +270°
- F2C2E1
Rosy Nectar
- F0CCA3
≈ Quiet Star
- ADE1C3
≈ Mountain Mint
- B1D7FE
≈ Malmö FF
Contrast & accessibility
Ag
FailOn white
WCAG 1.54:1 · APCA Lc 25
Ag
AAAOn black
WCAG 13.57:1 · APCA Lc 78
Best text color: #000000
WCAG 13.57:1 (AAA) · APCA Lc 78
Contrast pairs
Code snippets
CSS
:root {
--rosy-nectar: #f2c2e1;
--rosy-nectar-rgb: 242 194 225;
--rosy-nectar-oklch: oklch(0.865 0.068 339.7);
}
.element {
color: var(--rosy-nectar);
background-color: hsl(321 65% 85%);
border-color: oklch(0.865 0.068 339.7);
}Tailwind CSS v4
@theme {
--color-rosy-nectar: #f2c2e1;
--color-rosy-nectar-50: #ffeefb;
--color-rosy-nectar-100: #f9dfee;
--color-rosy-nectar-200: #eac9dd;
--color-rosy-nectar-300: #d1aac1;
--color-rosy-nectar-400: #ba8fab;
--color-rosy-nectar-500: #a57595;
--color-rosy-nectar-600: #8b637e;
--color-rosy-nectar-700: #704f65;
--color-rosy-nectar-800: #52394b;
--color-rosy-nectar-900: #392734;
--color-rosy-nectar-950: #23151f;
}SCSS
$rosy-nectar: #f2c2e1;
$rosy-nectar-rgb: 242, 194, 225;
$rosy-nectar-light: mix(#fff, $rosy-nectar, 20%);
$rosy-nectar-dark: mix(#000, $rosy-nectar, 20%);
.element {
color: $rosy-nectar;
box-shadow: 0 0 0 2px rgba($rosy-nectar, 0.35);
}