Named color · #F4CED8
Lover’s Retreat
Lover’s Retreat is #F4CED8: rgb(244 206 216), hsl(344 63% 88%), oklch(0.886 0.045 0.4). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Pink mean? → · Lover’s Retreat color name →
#F4CED8
oklch(0.886 0.045 0.4)
Color conversions
- HEX
- #f4ced8
- RGB
- rgb(244 206 216)
- HSL
- hsl(344 63% 88%)
- HWB
- hwb(344 81% 4%)
- OKLCH
- oklch(0.886 0.045 0.4)
- OKLab
- oklab(0.886 0.045 0)
- CIE Lab
- lab(86.27 14.95 0.27)
- LCH
- lch(86.27 14.95 1)
- CMYK
- cmyk(0% 16% 11% 4%)
Tints · Shades · Tones
Tints
- F5D3DC
- F7D8E0
- F8DDE4
- F9E2E7
- FAE6EB
- FBEBEF
- FCF0F3
- FDF5F7
- FEFAFB
Shades
- D4B3BC
- B598A0
- 977F85
- 7A666B
- 5E4E53
- 44383B
- 2B2325
- 140F11
- 030202
Tones
- E8C6CF
- DCBEC6
- D0B6BD
- C4AEB4
- B9A6AB
- AD9EA2
- A29799
- 968F91
- 8B8888
Color harmonies
Complementary +180°
- F4CED8
Lover’s Retreat
- BBE4DB
≈ Soothing Sea
Analogous -30° +30°
- F4CED8
Lover’s Retreat
- EBD0E8
≈ Lilacs in Spring
- F6CFC8
≈ Coral Candy
Triadic +120° +240°
- F4CED8
Lover’s Retreat
- D5DFBE
≈ Security
- C0DEF5
≈ Tropical Pool
Split-complementary +150° +210°
- F4CED8
Lover’s Retreat
- C6E2CB
≈ Wishful Green
- B9E2EA
≈ Alaskan Wind
Tetradic +90° +180° +270°
- F4CED8
Lover’s Retreat
- E5D9B9
≈ At the Beach
- BBE4DB
≈ Soothing Sea
- CED9F8
≈ Icy Plains
Contrast & accessibility
Ag
FailOn white
WCAG 1.43:1 · APCA Lc 21
Ag
AAAOn black
WCAG 14.66:1 · APCA Lc 83
Best text color: #000000
WCAG 14.66:1 (AAA) · APCA Lc 83
Contrast pairs
Code snippets
CSS
:root {
--lover-s-retreat: #f4ced8;
--lover-s-retreat-rgb: 244 206 216;
--lover-s-retreat-oklch: oklch(0.886 0.045 0.4);
}
.element {
color: var(--lover-s-retreat);
background-color: hsl(344 63% 88%);
border-color: oklch(0.886 0.045 0.4);
}Tailwind CSS v4
@theme {
--color-lover-s-retreat: #f4ced8;
--color-lover-s-retreat-50: #fff0f4;
--color-lover-s-retreat-100: #f6e2e6;
--color-lover-s-retreat-200: #e6cdd2;
--color-lover-s-retreat-300: #ccaeb5;
--color-lover-s-retreat-400: #b6949d;
--color-lover-s-retreat-500: #a07a85;
--color-lover-s-retreat-600: #876870;
--color-lover-s-retreat-700: #6c535a;
--color-lover-s-retreat-800: #503c42;
--color-lover-s-retreat-900: #37292e;
--color-lover-s-retreat-950: #22171a;
}SCSS
$lover-s-retreat: #f4ced8;
$lover-s-retreat-rgb: 244, 206, 216;
$lover-s-retreat-light: mix(#fff, $lover-s-retreat, 20%);
$lover-s-retreat-dark: mix(#000, $lover-s-retreat, 20%);
.element {
color: $lover-s-retreat;
box-shadow: 0 0 0 2px rgba($lover-s-retreat, 0.35);
}