Benannte Farbe · #F44772
Fuchsia Felicity
Fuchsia Felicity ist #F44772: rgb(244 71 114), hsl(345 89% 62%), oklch(0.656 0.209 10.6). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Red mean? → · Fuchsia Felicity color name →
#F44772
oklch(0.656 0.209 10.6)
Farbumrechnungen
- HEX
- #f44772
- RGB
- rgb(244 71 114)
- HSL
- hsl(345 89% 62%)
- HWB
- hwb(345 28% 4%)
- OKLCH
- oklch(0.656 0.209 10.6)
- OKLab
- oklab(0.656 0.206 0.038)
- CIE Lab
- lab(57.72 68.01 16.67)
- LCH
- lch(57.72 70.02 13.8)
- CMYK
- cmyk(0% 71% 53% 4%)
Tints · Shades · Tones
Tints
- F85F7F
- FC738D
- FF869B
- FF99A8
- FFAAB6
- FFBCC5
- FFCDD3
- FFDDE1
- FFEEF0
Shades
- D43D62
- B53253
- 972844
- 7A1F36
- 5E1628
- 440D1B
- 2B060E
- 140204
- 030001
Tones
- EA5174
- DF5A75
- D46176
- CA6778
- BE6D79
- B3717B
- A7767C
- 9B7A7D
- 8E7D7F
Farbharmonien
Komplementär +180°
- F44772
Fuchsia Felicity
- 00A7A1
≈ Jadestone
Analog -30° +30°
- F44772
Fuchsia Felicity
- DF50B7
≈ Orion
- F25700
≈ Buffallo Sauce
Triadisch +120° +240°
- F44772
Fuchsia Felicity
- 6AA500
≈ Herbal Lift
- 0093FE
≈ Starfleet Blue
Geteilt komplementär +150° +210°
- F44772
Fuchsia Felicity
- 00AC72
≈ Bright Camouflage
- 00A1C4
≈ Scuba Blue
Tetradisch +90° +180° +270°
- F44772
Fuchsia Felicity
- A49200
≈ Romaine Green
- 00A7A1
≈ Jadestone
- 7F7DFF
≈ Blue Party Parrot
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 3.50:1 · APCA Lc 61
Ag
AAAuf Schwarz
WCAG 5.99:1 · APCA Lc 40
Beste Textfarbe: #000000
WCAG 5.99:1 (AA) · APCA Lc 40
Contrast pairs
Code-Snippets
CSS
:root {
--fuchsia-felicity: #f44772;
--fuchsia-felicity-rgb: 244 71 114;
--fuchsia-felicity-oklch: oklch(0.656 0.209 10.6);
}
.element {
color: var(--fuchsia-felicity);
background-color: hsl(345 89% 62%);
border-color: oklch(0.656 0.209 10.6);
}Tailwind CSS v4
@theme {
--color-fuchsia-felicity: #f44772;
--color-fuchsia-felicity-50: #ffdde5;
--color-fuchsia-felicity-100: #ffcbd5;
--color-fuchsia-felicity-200: #ffaebb;
--color-fuchsia-felicity-300: #ff859a;
--color-fuchsia-felicity-400: #ff5c80;
--color-fuchsia-felicity-500: #ef2664;
--color-fuchsia-felicity-600: #ca2455;
--color-fuchsia-felicity-700: #a21d44;
--color-fuchsia-felicity-800: #791334;
--color-fuchsia-felicity-900: #560c23;
--color-fuchsia-felicity-950: #390012;
}SCSS
$fuchsia-felicity: #f44772;
$fuchsia-felicity-rgb: 244, 71, 114;
$fuchsia-felicity-light: mix(#fff, $fuchsia-felicity, 20%);
$fuchsia-felicity-dark: mix(#000, $fuchsia-felicity, 20%);
.element {
color: $fuchsia-felicity;
box-shadow: 0 0 0 2px rgba($fuchsia-felicity, 0.35);
}