Najbliższy nazwany kolor · #F4E1EA
#F4E1EA
Najbliższy nazwany kolor: First Crush
#F4E1EA (rgb(244 225 234), hsl(332 46% 92%), oklch(0.928 0.024 347.2)) jest najbliższy nazwanemu kolorowi First Crush. Zobacz odcienie, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
#F4E1EA
oklch(0.928 0.024 347.2)
Konwersje koloru
- HEX
- #f4e1ea
- RGB
- rgb(244 225 234)
- HSL
- hsl(332 46% 92%)
- HWB
- hwb(332 88% 4%)
- OKLCH
- oklch(0.928 0.024 347.2)
- OKLab
- oklab(0.928 0.023 -0.005)
- CIE Lab
- lab(91.28 7.85 -1.93)
- LCH
- lch(91.28 8.09 346.2)
- CMYK
- cmyk(0% 8% 4% 4%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- F5E4EC
- F6E7EE
- F7EAF0
- F9EDF2
- FAF0F4
- FBF3F7
- FCF6F9
- FDF9FB
- FEFCFD
Odcienie ciemniejsze
- D4C4CB
- B5A7AE
- 978B91
- 7A7075
- 5E565A
- 443E41
- 2B2729
- 141213
- 030203
Tony
- E8D7DF
- DCCDD4
- D0C3C9
- C4B9BE
- B8AFB4
- ADA6A9
- A19C9F
- 969394
- 8B898A
Harmonie kolorów
Komplementarna +180°
- F4E1EA
First Crush
- D9ECE4
≈ Dunnock Egg
Analogowa -30° +30°
- F4E1EA
First Crush
- EEE2F2
≈ Sheer Lavender
- F7E1E1
≈ Lighthearted
Triada +120° +240°
- F4E1EA
First Crush
- E8E9D7
≈ Reduced Green
- D7EBF4
≈ Spacious Skies
Komplementarna rozszczepiona +150° +210°
- F4E1EA
First Crush
- E0EBDC
≈ Lighter Mint
- D6ECEC
≈ Water Squirt
Tetrada +90° +180° +270°
- F4E1EA
First Crush
- F0E5D6
≈ Pale Chamois
- D9ECE4
≈ Dunnock Egg
- DDE8F7
≈ St. Petersburg
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.24:1 · APCA Lc 12
Ag
AAANa czerni
WCAG 16.80:1 · APCA Lc 92
Najlepszy kolor tekstu: #000000
WCAG 16.80:1 (AAA) · APCA Lc 92
Contrast pairs
Fragmenty kodu
CSS
:root {
--first-crush: #f4e1ea;
--first-crush-rgb: 244 225 234;
--first-crush-oklch: oklch(0.928 0.024 347.2);
}
.element {
color: var(--first-crush);
background-color: hsl(332 46% 92%);
border-color: oklch(0.928 0.024 347.2);
}Tailwind CSS v4
@theme {
--color-first-crush: #f4e1ea;
--color-first-crush-50: #fbf2f6;
--color-first-crush-100: #eee5e9;
--color-first-crush-200: #ddd0d6;
--color-first-crush-300: #c1b3b9;
--color-first-crush-400: #aa99a1;
--color-first-crush-500: #938089;
--color-first-crush-600: #7c6c74;
--color-first-crush-700: #63575d;
--color-first-crush-800: #493f44;
--color-first-crush-900: #322b2f;
--color-first-crush-950: #1e191c;
}SCSS
$first-crush: #f4e1ea;
$first-crush-rgb: 244, 225, 234;
$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);
}