Benannte Farbe · #F3E5D1
White Hyacinth
White Hyacinth ist #F3E5D1: rgb(243 229 209), hsl(35 59% 89%), oklch(0.928 0.031 77). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Gray mean? → · White Hyacinth color name →
#F3E5D1
oklch(0.928 0.031 77)
Farbumrechnungen
- HEX
- #f3e5d1
- RGB
- rgb(243 229 209)
- HSL
- hsl(35 59% 89%)
- HWB
- hwb(35 82% 5%)
- OKLCH
- oklch(0.928 0.031 77)
- OKLab
- oklab(0.928 0.007 0.03)
- CIE Lab
- lab(91.67 2.52 11.59)
- LCH
- lch(91.67 11.86 77.7)
- CMYK
- cmyk(0% 6% 14% 5%)
Tints · Shades · Tones
Tints
- F4E8D6
- F5EADA
- F7EDDF
- F8EFE3
- F9F2E8
- FAF5ED
- FBF7F1
- FDFAF6
- FEFCFA
Shades
- D3C7B5
- B4AA9B
- 978E81
- 7A7268
- 5E5850
- 443F39
- 2B2823
- 141210
- 030302
Tones
- E7DAC9
- DBD0C0
- CFC6B8
- C3BBB0
- B8B1A8
- ACA7A0
- A19D98
- 969390
- 8B8A88
Farbharmonien
Komplementär +180°
- F3E5D1
White Hyacinth
- DAE8FC
≈ Cloudless
Analog -30° +30°
- F3E5D1
White Hyacinth
- FAE2D6
≈ Pink Touch
- E9E9D2
≈ Magical Melon
Triadisch +120° +240°
- F3E5D1
White Hyacinth
- D1EEEE
≈ A Certain Shade of Green
- F0E1F5
≈ Sheer Lavender
Geteilt komplementär +150° +210°
- F3E5D1
White Hyacinth
- D3ECF7
≈ Ice Castle
- E5E5FB
≈ Lavender Mist
Tetradisch +90° +180° +270°
- F3E5D1
White Hyacinth
- D5EEE3
≈ Dreamy Clouds
- DAE8FC
≈ Cloudless
- F8DFEB
≈ Pork Belly
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.23:1 · APCA Lc 12
Ag
AAAAuf Schwarz
WCAG 16.93:1 · APCA Lc 92
Beste Textfarbe: #000000
WCAG 16.93:1 (AAA) · APCA Lc 92
Contrast pairs
Code-Snippets
CSS
:root {
--white-hyacinth: #f3e5d1;
--white-hyacinth-rgb: 243 229 209;
--white-hyacinth-oklch: oklch(0.928 0.031 77);
}
.element {
color: var(--white-hyacinth);
background-color: hsl(35 59% 89%);
border-color: oklch(0.928 0.031 77);
}Tailwind CSS v4
@theme {
--color-white-hyacinth: #f3e5d1;
--color-white-hyacinth-50: #faf4ec;
--color-white-hyacinth-100: #ede7dd;
--color-white-hyacinth-200: #dbd3c6;
--color-white-hyacinth-300: #c0b6a6;
--color-white-hyacinth-400: #a99c8b;
--color-white-hyacinth-500: #928470;
--color-white-hyacinth-600: #7b705f;
--color-white-hyacinth-700: #63594c;
--color-white-hyacinth-800: #494137;
--color-white-hyacinth-900: #322d25;
--color-white-hyacinth-950: #1e1a14;
}SCSS
$white-hyacinth: #f3e5d1;
$white-hyacinth-rgb: 243, 229, 209;
$white-hyacinth-light: mix(#fff, $white-hyacinth, 20%);
$white-hyacinth-dark: mix(#000, $white-hyacinth, 20%);
.element {
color: $white-hyacinth;
box-shadow: 0 0 0 2px rgba($white-hyacinth, 0.35);
}