Adlandırılmış renk · #9900FA
Vivid Purple
Vivid Purple, #9900FA: rgb(153 0 250), hsl(277 100% 49%), oklch(0.555 0.292 302.9). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Purple mean? → · Vivid Purple color name →
#9900FA
oklch(0.555 0.292 302.9)
Renk dönüşümleri
- HEX
- #9900fa
- RGB
- rgb(153 0 250)
- HSL
- hsl(277 100% 49%)
- HWB
- hwb(277 0% 2%)
- OKLCH
- oklch(0.555 0.292 302.9)
- OKLab
- oklab(0.555 0.158 -0.245)
- CIE Lab
- lab(42.59 76.86 -87.15)
- LCH
- lch(42.59 116.2 311.4)
- CMYK
- cmyk(39% 100% 0% 2%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- A23EFD
- AC5BFF
- B574FF
- BF8AFF
- C99EFF
- D4B2FF
- DEC6FF
- E9D9FF
- F4ECFF
Koyu tonlar
- 8400D9
- 7000BA
- 5D009B
- 4A007D
- 380061
- 270046
- 17002D
- 080015
- 010003
Gri tonlar
- 962CEE
- 933FE3
- 914DD7
- 8E58CB
- 8B61C0
- 8968B4
- 876FA7
- 84759B
- 827B8E
Renk uyumları
Tamamlayıcı +180°
- 9900FA
Vivid Purple
- 657F00
≈ Jungle Vibes
Analog -30° +30°
- 9900FA
Vivid Purple
- 4C55FF
≈ Hooloovoo Blue
- BF00AF
≈ Purple Pirate
Üçlü +120° +240°
- 9900FA
Vivid Purple
- A65F00
≈ Raw Umber
- 008678
≈ Mystic Turquoise
Bölünmüş tamamlayıcı +150° +210°
- 9900FA
Vivid Purple
- 8A7000
≈ Vermin Brown
- 008A48
≈ Real Turquoise
Dörtlü +90° +180° +270°
- 9900FA
Vivid Purple
- D02900
≈ Particle Ioniser Red
- 657F00
≈ Jungle Vibes
- 008195
≈ Craftsman Blue
Kontrast ve erişilebilirlik
Ag
AABeyaz üzerinde
WCAG 5.62:1 · APCA Lc 75
Ag
FailSiyah üzerinde
WCAG 3.73:1 · APCA Lc 26
En iyi metin rengi: #FFFFFF
WCAG 5.62:1 (AA) · APCA Lc 75
Contrast pairs
Kod parçacıkları
CSS
:root {
--vivid-purple: #9900fa;
--vivid-purple-rgb: 153 0 250;
--vivid-purple-oklch: oklch(0.555 0.292 302.9);
}
.element {
color: var(--vivid-purple);
background-color: hsl(277 100% 49%);
border-color: oklch(0.555 0.292 302.9);
}Tailwind CSS v4
@theme {
--color-vivid-purple: #9900fa;
--color-vivid-purple-50: #ffe0ff;
--color-vivid-purple-100: #feceff;
--color-vivid-purple-200: #f1b1ff;
--color-vivid-purple-300: #db87ff;
--color-vivid-purple-400: #c35dff;
--color-vivid-purple-500: #b110ff;
--color-vivid-purple-600: #9519f2;
--color-vivid-purple-700: #7816c3;
--color-vivid-purple-800: #560f94;
--color-vivid-purple-900: #3c0b69;
--color-vivid-purple-950: #260049;
}SCSS
$vivid-purple: #9900fa;
$vivid-purple-rgb: 153, 0, 250;
$vivid-purple-light: mix(#fff, $vivid-purple, 20%);
$vivid-purple-dark: mix(#000, $vivid-purple, 20%);
.element {
color: $vivid-purple;
box-shadow: 0 0 0 2px rgba($vivid-purple, 0.35);
}