Nazwany kolor · #37115C
Wicked Purple
Wicked Purple to #37115C: rgb(55 17 92), hsl(270 69% 21%), oklch(0.286 0.124 301.9). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Purple mean? → · Wicked Purple color name →
#37115C
oklch(0.286 0.124 301.9)
Konwersje koloru
- HEX
- #37115c
- RGB
- rgb(55 17 92)
- HSL
- hsl(270 69% 21%)
- HWB
- hwb(270 7% 64%)
- OKLCH
- oklch(0.286 0.124 301.9)
- OKLab
- oklab(0.286 0.066 -0.106)
- CIE Lab
- lab(14.96 30.73 -37.54)
- LCH
- lch(14.96 48.51 309.3)
- CMYK
- cmyk(40% 82% 0% 64%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 482A6C
- 5A407D
- 6D578D
- 806D9D
- 9484AD
- A89CBD
- BDB4CE
- D3CDDE
- E9E6EF
Odcienie ciemniejsze
- 2E0D4F
- 260942
- 1E0636
- 16042A
- 0F021F
- 080114
- 03000A
- 010003
- 000000
Tony
- 3E1F60
- 442B65
- 4B3669
- 52406D
- 5A4B70
- 615674
- 696077
- 706B7A
- 78757D
Harmonie kolorów
Komplementarna +180°
- 37115C
Wicked Purple
- 252F00
≈ Blind Forest
Analogowa -30° +30°
- 37115C
Wicked Purple
- 181E66
≈ Pure Midnight
- 4A0345
≈ Alien Purple
Triada +120° +240°
- 37115C
Wicked Purple
- 412100
≈ Blackened Brown
- 00322C
≈ Fence Green
Komplementarna rozszczepiona +150° +210°
- 37115C
Wicked Purple
- 352900
≈ Secret Passage
- 003416
≈ Haunted Hills
Tetrada +90° +180° +270°
- 37115C
Wicked Purple
- 540800
≈ Burned
- 252F00
≈ Blind Forest
- 003139
≈ Artist Blue
Kontrast i dostępność
Ag
AAANa bieli
WCAG 15.03:1 · APCA Lc 101
Ag
FailNa czerni
WCAG 1.39:1 · APCA Lc 0
Najlepszy kolor tekstu: #FFFFFF
WCAG 15.03:1 (AAA) · APCA Lc 101
Contrast pairs
Fragmenty kodu
CSS
:root {
--wicked-purple: #37115c;
--wicked-purple-rgb: 55 17 92;
--wicked-purple-oklch: oklch(0.286 0.124 301.9);
}
.element {
color: var(--wicked-purple);
background-color: hsl(270 69% 21%);
border-color: oklch(0.286 0.124 301.9);
}Tailwind CSS v4
@theme {
--color-wicked-purple: #37115c;
--color-wicked-purple-50: #fdedff;
--color-wicked-purple-100: #f1deff;
--color-wicked-purple-200: #dfc8ff;
--color-wicked-purple-300: #c5a8ec;
--color-wicked-purple-400: #ac8cdc;
--color-wicked-purple-500: #9670ca;
--color-wicked-purple-600: #7f5fab;
--color-wicked-purple-700: #654c89;
--color-wicked-purple-800: #493767;
--color-wicked-purple-900: #332648;
--color-wicked-purple-950: #1f142f;
}SCSS
$wicked-purple: #37115c;
$wicked-purple-rgb: 55, 17, 92;
$wicked-purple-light: mix(#fff, $wicked-purple, 20%);
$wicked-purple-dark: mix(#000, $wicked-purple, 20%);
.element {
color: $wicked-purple;
box-shadow: 0 0 0 2px rgba($wicked-purple, 0.35);
}