Benannte Farbe · #F1DFE9
Mellow Flower
Mellow Flower ist #F1DFE9: rgb(241 223 233), hsl(327 39% 91%), oklch(0.921 0.024 343). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Gray mean? → · Mellow Flower color name →
#F1DFE9
oklch(0.921 0.024 343)
Farbumrechnungen
- HEX
- #f1dfe9
- RGB
- rgb(241 223 233)
- HSL
- hsl(327 39% 91%)
- HWB
- hwb(327 87% 5%)
- OKLCH
- oklch(0.921 0.024 343)
- OKLab
- oklab(0.921 0.023 -0.007)
- CIE Lab
- lab(90.51 7.64 -2.56)
- LCH
- lch(90.51 8.06 341.5)
- CMYK
- cmyk(0% 7% 3% 5%)
Tints · Shades · Tones
Tints
- F2E2EB
- F4E5ED
- F5E9F0
- F7ECF2
- F8EFF4
- F9F2F6
- FBF5F8
- FCF9FB
- FEFCFD
Shades
- D2C2CB
- B3A5AD
- 958A90
- 796F74
- 5D565A
- 433D41
- 2B2729
- 141213
- 030203
Tones
- E5D5DE
- D9CBD3
- CEC2C8
- C2B8BE
- B7AEB3
- ACA5A9
- A19B9E
- 969294
- 8B898A
Farbharmonien
Komplementär +180°
- F1DFE9
Mellow Flower
- D8EAE0
≈ Green Emulsion
Analog -30° +30°
- F1DFE9
Mellow Flower
- EAE1F0
≈ Romantic Cruise
- F4DFE0
≈ Hint of Red
Triadisch +120° +240°
- F1DFE9
Mellow Flower
- E7E6D4
≈ Minified Mustard
- D5E9F1
≈ Spacious Skies
Geteilt komplementär +150° +210°
- F1DFE9
Mellow Flower
- DFE9D9
≈ Mint Emulsion
- D4EAE9
≈ Retiring Blue
Tetradisch +90° +180° +270°
- F1DFE9
Mellow Flower
- EFE3D4
≈ Agrodolce
- D8EAE0
≈ Green Emulsion
- DAE6F5
≈ Icicle Veil
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.27:1 · APCA Lc 14
Ag
AAAAuf Schwarz
WCAG 16.47:1 · APCA Lc 90
Beste Textfarbe: #000000
WCAG 16.47:1 (AAA) · APCA Lc 90
Contrast pairs
Code-Snippets
CSS
:root {
--mellow-flower: #f1dfe9;
--mellow-flower-rgb: 241 223 233;
--mellow-flower-oklch: oklch(0.921 0.024 343);
}
.element {
color: var(--mellow-flower);
background-color: hsl(327 39% 91%);
border-color: oklch(0.921 0.024 343);
}Tailwind CSS v4
@theme {
--color-mellow-flower: #f1dfe9;
--color-mellow-flower-50: #faf3f7;
--color-mellow-flower-100: #eee5ea;
--color-mellow-flower-200: #dcd0d6;
--color-mellow-flower-300: #c1b3ba;
--color-mellow-flower-400: #a999a2;
--color-mellow-flower-500: #92808a;
--color-mellow-flower-600: #7c6d75;
--color-mellow-flower-700: #63575e;
--color-mellow-flower-800: #483f45;
--color-mellow-flower-900: #322c30;
--color-mellow-flower-950: #1e191c;
}SCSS
$mellow-flower: #f1dfe9;
$mellow-flower-rgb: 241, 223, 233;
$mellow-flower-light: mix(#fff, $mellow-flower, 20%);
$mellow-flower-dark: mix(#000, $mellow-flower, 20%);
.element {
color: $mellow-flower;
box-shadow: 0 0 0 2px rgba($mellow-flower, 0.35);
}