Nazwany kolor · #FF5599
Fuchsia Fever
Fuchsia Fever to #FF5599: rgb(255 85 153), hsl(336 100% 67%), oklch(0.698 0.212 359.7). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Red mean? → · Fuchsia Fever color name →
#FF5599
oklch(0.698 0.212 359.7)
Konwersje koloru
- HEX
- #ff5599
- RGB
- rgb(255 85 153)
- HSL
- hsl(336 100% 67%)
- HWB
- hwb(336 33% 0%)
- OKLCH
- oklch(0.698 0.212 359.7)
- OKLab
- oklab(0.698 0.212 -0.001)
- CIE Lab
- lab(62.25 68.82 0.54)
- LCH
- lch(62.25 68.82 0.4)
- CMYK
- cmyk(0% 67% 40% 0%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- FF6AA3
- FF7DAD
- FF8FB7
- FFA0C1
- FFB0CB
- FFC0D5
- FFD0DF
- FFE0EA
- FFEFF4
Odcienie ciemniejsze
- DE4984
- BE3D70
- 9E315D
- 80264A
- 631C38
- 481127
- 2E0817
- 160208
- 030001
Tony
- F35D96
- E76494
- DC6991
- CF6E8F
- C3728C
- B7768A
- AA7987
- 9C7C85
- 8F7E82
Harmonie kolorów
Komplementarna +180°
- FF5599
Fuchsia Fever
- 00B7A0
≈ Aare River
Analogowa -30° +30°
- FF5599
Fuchsia Fever
- E262DC
≈ Free Speech Magenta
- FF6350
≈ Pickled Salmon
Triada +120° +240°
- FF5599
Fuchsia Fever
- 92AB00
≈ Barf Green
- 00A8F5
≈ Vivid Cerulean
Komplementarna rozszczepiona +150° +210°
- FF5599
Fuchsia Fever
- 00BD56
≈ Intoxicate
- 00B1C6
≈ Antigua Blue
Tetrada +90° +180° +270°
- FF5599
Fuchsia Fever
- C09800
≈ Rapeseed
- 00B7A0
≈ Aare River
- 7796FF
≈ Periwinkle Blue
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.99:1 · APCA Lc 56
Ag
AAANa czerni
WCAG 7.01:1 · APCA Lc 46
Najlepszy kolor tekstu: #000000
WCAG 7.01:1 (AAA) · APCA Lc 46
Contrast pairs
Fragmenty kodu
CSS
:root {
--fuchsia-fever: #ff5599;
--fuchsia-fever-rgb: 255 85 153;
--fuchsia-fever-oklch: oklch(0.698 0.212 359.7);
}
.element {
color: var(--fuchsia-fever);
background-color: hsl(336 100% 67%);
border-color: oklch(0.698 0.212 359.7);
}Tailwind CSS v4
@theme {
--color-fuchsia-fever: #ff5599;
--color-fuchsia-fever-50: #ffdcf1;
--color-fuchsia-fever-100: #ffcae3;
--color-fuchsia-fever-200: #ffacce;
--color-fuchsia-fever-300: #ff84af;
--color-fuchsia-fever-400: #fc5c9a;
--color-fuchsia-fever-500: #ea2581;
--color-fuchsia-fever-600: #c6246d;
--color-fuchsia-fever-700: #9f1d57;
--color-fuchsia-fever-800: #761342;
--color-fuchsia-fever-900: #540c2e;
--color-fuchsia-fever-950: #38001b;
}SCSS
$fuchsia-fever: #ff5599;
$fuchsia-fever-rgb: 255, 85, 153;
$fuchsia-fever-light: mix(#fff, $fuchsia-fever, 20%);
$fuchsia-fever-dark: mix(#000, $fuchsia-fever, 20%);
.element {
color: $fuchsia-fever;
box-shadow: 0 0 0 2px rgba($fuchsia-fever, 0.35);
}