Adlandırılmış renk · #BB22BB
Fuchsia Flair
Fuchsia Flair, #BB22BB: rgb(187 34 187), hsl(300 69% 43%), oklch(0.567 0.24 328.2). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Purple mean? → · Fuchsia Flair color name →
#BB22BB
oklch(0.567 0.24 328.2)
Renk dönüşümleri
- HEX
- #bb22bb
- RGB
- rgb(187 34 187)
- HSL
- hsl(300 69% 43%)
- HWB
- hwb(300 13% 27%)
- OKLCH
- oklch(0.567 0.24 328.2)
- OKLab
- oklab(0.567 0.204 -0.127)
- CIE Lab
- lab(45.93 69.58 -45.39)
- LCH
- lch(45.93 83.07 326.9)
- CMYK
- cmyk(0% 82% 0% 27%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- C444C3
- CC5DCA
- D473D1
- DB88D8
- E29CDF
- E9B0E6
- EFC4EC
- F5D8F3
- FAEBF9
Koyu tonlar
- A21CA2
- 8A168A
- 731173
- 5C0B5C
- 460746
- 320332
- 1F011F
- 0D000D
- 020002
Gri tonlar
- B635B6
- B143B0
- AC4EAA
- A757A5
- A1609F
- 9B6799
- 956E93
- 8F748D
- 887A87
Renk uyumları
Tamamlayıcı +180°
- BB22BB
Fuchsia Flair
- 008F38
≈ Viper Green
Analog -30° +30°
- BB22BB
Fuchsia Flair
- 8D42ED
≈ Chaste Blossoms
- D50075
≈ Moth Orchid
Üçlü +120° +240°
- BB22BB
Fuchsia Flair
- 937100
≈ Vermin Brown
- 008694
≈ Tropical Teal
Bölünmüş tamamlayıcı +150° +210°
- BB22BB
Fuchsia Flair
- 708000
≈ Verde Tropa
- 008A77
≈ Emerald Enchantment
Dörtlü +90° +180° +270°
- BB22BB
Fuchsia Flair
- B05E00
≈ Orangish Brown
- 008F38
≈ Viper Green
- 007FB7
≈ Meissen Blue
Kontrast ve erişilebilirlik
Ag
AABeyaz üzerinde
WCAG 5.17:1 · APCA Lc 74
Ag
FailSiyah üzerinde
WCAG 4.05:1 · APCA Lc 28
En iyi metin rengi: #FFFFFF
WCAG 5.17:1 (AA) · APCA Lc 74
Contrast pairs
Kod parçacıkları
CSS
:root {
--fuchsia-flair: #bb22bb;
--fuchsia-flair-rgb: 187 34 187;
--fuchsia-flair-oklch: oklch(0.567 0.24 328.2);
}
.element {
color: var(--fuchsia-flair);
background-color: hsl(300 69% 43%);
border-color: oklch(0.567 0.24 328.2);
}Tailwind CSS v4
@theme {
--color-fuchsia-flair: #bb22bb;
--color-fuchsia-flair-50: #ffddff;
--color-fuchsia-flair-100: #ffcbff;
--color-fuchsia-flair-200: #ffadff;
--color-fuchsia-flair-300: #fa84f1;
--color-fuchsia-flair-400: #e65de4;
--color-fuchsia-flair-500: #d326d3;
--color-fuchsia-flair-600: #b225b2;
--color-fuchsia-flair-700: #8f1e8f;
--color-fuchsia-flair-800: #69146d;
--color-fuchsia-flair-900: #4a0d4d;
--color-fuchsia-flair-950: #300033;
}SCSS
$fuchsia-flair: #bb22bb;
$fuchsia-flair-rgb: 187, 34, 187;
$fuchsia-flair-light: mix(#fff, $fuchsia-flair, 20%);
$fuchsia-flair-dark: mix(#000, $fuchsia-flair, 20%);
.element {
color: $fuchsia-flair;
box-shadow: 0 0 0 2px rgba($fuchsia-flair, 0.35);
}