Nearest named color · #F5E3EB
#F5E3EB
Nearest named color: First Crush
#F5E3EB (rgb(245 227 235), hsl(333 47% 93%), oklch(0.932 0.022 348.8)) is closest to the named color First Crush. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#F5E3EB
oklch(0.932 0.022 348.8)
Color conversions
- HEX
- #f5e3eb
- RGB
- rgb(245 227 235)
- HSL
- hsl(333 47% 93%)
- HWB
- hwb(333 89% 4%)
- OKLCH
- oklch(0.932 0.022 348.8)
- OKLab
- oklab(0.932 0.022 -0.004)
- CIE Lab
- lab(91.87 7.36 -1.57)
- LCH
- lch(91.87 7.53 347.9)
- CMYK
- cmyk(0% 7% 4% 4%)
Tints · Shades · Tones
Tints
- F6E6ED
- F7E9EF
- F8EBF1
- F9EEF3
- FAF1F5
- FBF4F7
- FCF7F9
- FDF9FB
- FEFCFD
Shades
- D5C5CC
- B6A8AE
- 988C91
- 7B7175
- 5F575B
- 443F41
- 2B2729
- 151213
- 030303
Tones
- E9D9E0
- DDCED5
- D1C4CA
- C5BABF
- B9B0B4
- ADA6A9
- A29D9F
- 969394
- 8B898A
Color harmonies
Complementary +180°
- F5E3EB
First Crush
- DBEEE6
≈ Shattered Ice
Analogous -30° +30°
- F5E3EB
First Crush
- EFE4F2
≈ Holographic Lavender
- F7E3E3
≈ Faint Pink
Triadic +120° +240°
- F5E3EB
First Crush
- E9EAD9
≈ Really Light Green
- DAECF5
≈ Ice Fishing
Split-complementary +150° +210°
- F5E3EB
First Crush
- E1EDDE
≈ Establish Mint
- D9EEEE
≈ Blue Green Rules
Tetradic +90° +180° +270°
- F5E3EB
First Crush
- F1E7D9
≈ Ballet White
- DBEEE6
≈ Shattered Ice
- E0E9F8
≈ Husky
Contrast & accessibility
Ag
FailOn white
WCAG 1.23:1 · APCA Lc 11
Ag
AAAOn black
WCAG 17.06:1 · APCA Lc 93
Best text color: #000000
WCAG 17.06:1 (AAA) · APCA Lc 93
Contrast pairs
Code snippets
CSS
:root {
--first-crush: #f5e3eb;
--first-crush-rgb: 245 227 235;
--first-crush-oklch: oklch(0.932 0.022 348.8);
}
.element {
color: var(--first-crush);
background-color: hsl(333 47% 93%);
border-color: oklch(0.932 0.022 348.8);
}Tailwind CSS v4
@theme {
--color-first-crush: #f5e3eb;
--color-first-crush-50: #fbf3f6;
--color-first-crush-100: #eee5e9;
--color-first-crush-200: #dcd1d5;
--color-first-crush-300: #c1b3b9;
--color-first-crush-400: #a999a0;
--color-first-crush-500: #928088;
--color-first-crush-600: #7c6d73;
--color-first-crush-700: #63575c;
--color-first-crush-800: #483f44;
--color-first-crush-900: #322c2f;
--color-first-crush-950: #1e191b;
}SCSS
$first-crush: #f5e3eb;
$first-crush-rgb: 245, 227, 235;
$first-crush-light: mix(#fff, $first-crush, 20%);
$first-crush-dark: mix(#000, $first-crush, 20%);
.element {
color: $first-crush;
box-shadow: 0 0 0 2px rgba($first-crush, 0.35);
}