Najbliższy nazwany kolor · #5B006A
#5B006A
Najbliższy nazwany kolor: Velvet Vortex
#5B006A (rgb(91 0 106), hsl(292 100% 21%), oklch(0.342 0.163 320.7)) jest najbliższy nazwanemu kolorowi Velvet Vortex. Zobacz odcienie, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
#5B006A
oklch(0.342 0.163 320.7)
Konwersje koloru
- HEX
- #5b006a
- RGB
- rgb(91 0 106)
- HSL
- hsl(292 100% 21%)
- HWB
- hwb(292 0% 58%)
- OKLCH
- oklch(0.342 0.163 320.7)
- OKLab
- oklab(0.342 0.127 -0.103)
- CIE Lab
- lab(20.83 46.01 -36.89)
- LCH
- lch(20.83 58.98 321.3)
- CMYK
- cmyk(14% 100% 0% 58%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 6B2579
- 7C3F88
- 8C5697
- 9C6EA6
- AD85B5
- BD9DC3
- CDB5D2
- DECDE1
- EEE6F0
Odcienie ciemniejsze
- 4E005B
- 41004D
- 35003F
- 290031
- 1E0024
- 130018
- 09000D
- 030004
- 000000
Tony
- 60186D
- 642870
- 683472
- 6C4075
- 704B77
- 735679
- 77617B
- 7A6B7D
- 7D767F
Harmonie kolorów
Komplementarna +180°
- 5B006A
Velvet Vortex
- 0C4500
≈ Industrial Green
Analogowa -30° +30°
- 5B006A
Velvet Vortex
- 3E1884
≈ Pixie Powder
- 690042
≈ Tyrian Purple
Triada +120° +240°
- 5B006A
Velvet Vortex
- 4B3400
≈ Night in the Woods
- 004145
≈ Warm Black
Komplementarna rozszczepiona +150° +210°
- 5B006A
Velvet Vortex
- 3B3B00
≈ Dark Olive
- 004333
≈ UP Forest Green
Tetrada +90° +180° +270°
- 5B006A
Velvet Vortex
- 5B2700
≈ Hot Fudge
- 0C4500
≈ Industrial Green
- 003E55
≈ Maniac Mansion
Kontrast i dostępność
Ag
AAANa bieli
WCAG 12.70:1 · APCA Lc 97
Ag
FailNa czerni
WCAG 1.65:1 · APCA Lc 0
Najlepszy kolor tekstu: #FFFFFF
WCAG 12.70:1 (AAA) · APCA Lc 97
Contrast pairs
Fragmenty kodu
CSS
:root {
--velvet-vortex: #5b006a;
--velvet-vortex-rgb: 91 0 106;
--velvet-vortex-oklch: oklch(0.342 0.163 320.7);
}
.element {
color: var(--velvet-vortex);
background-color: hsl(292 100% 21%);
border-color: oklch(0.342 0.163 320.7);
}Tailwind CSS v4
@theme {
--color-velvet-vortex: #5b006a;
--color-velvet-vortex-50: #ffe6ff;
--color-velvet-vortex-100: #ffd6ff;
--color-velvet-vortex-200: #f6bdfd;
--color-velvet-vortex-300: #df9ae8;
--color-velvet-vortex-400: #c97bd9;
--color-velvet-vortex-500: #b55bc7;
--color-velvet-vortex-600: #994ea8;
--color-velvet-vortex-700: #7b3e87;
--color-velvet-vortex-800: #5a2d66;
--color-velvet-vortex-900: #3f1e47;
--color-velvet-vortex-950: #280d2f;
}SCSS
$velvet-vortex: #5b006a;
$velvet-vortex-rgb: 91, 0, 106;
$velvet-vortex-light: mix(#fff, $velvet-vortex, 20%);
$velvet-vortex-dark: mix(#000, $velvet-vortex, 20%);
.element {
color: $velvet-vortex;
box-shadow: 0 0 0 2px rgba($velvet-vortex, 0.35);
}