Najbliższy nazwany kolor · #A457A8
#A457A8
Najbliższy nazwany kolor: Prickly Purple
#A457A8 (rgb(164 87 168), hsl(297 32% 50%), oklch(0.578 0.146 325.4)) jest najbliższy nazwanemu kolorowi Prickly Purple. Zobacz odcienie, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
#A457A8
oklch(0.578 0.146 325.4)
Konwersje koloru
- HEX
- #a457a8
- RGB
- rgb(164 87 168)
- HSL
- hsl(297 32% 50%)
- HWB
- hwb(297 34% 34%)
- OKLCH
- oklch(0.578 0.146 325.4)
- OKLab
- oklab(0.578 0.12 -0.083)
- CIE Lab
- lab(48.84 41.28 -30)
- LCH
- lch(48.84 51.03 324)
- CMYK
- cmyk(2% 48% 0% 34%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- AE68B1
- B779BA
- C189C3
- CA9ACB
- D3AAD4
- DCBBDD
- E5CCE5
- EEDDEE
- F6EEF6
Odcienie ciemniejsze
- 8E4B92
- 793E7C
- 643367
- 502752
- 3D1C3F
- 2B122C
- 1A081A
- 0A030A
- 010001
Tony
- A15CA4
- 9E61A0
- 9A659D
- 976A99
- 946E95
- 907291
- 8C768D
- 887989
- 847D84
Harmonie kolorów
Komplementarna +180°
- A457A8
Prickly Purple
- 348F3F
≈ Green Ribbon
Analogowa -30° +30°
- A457A8
Prickly Purple
- 8264C5
≈ Lavish Spending
- BA4F7D
≈ Exuberant Pink
Triada +120° +240°
- A457A8
Prickly Purple
- 997300
≈ Glazed Chestnut
- 008A96
≈ Zuni
Komplementarna rozszczepiona +150° +210°
- A457A8
Prickly Purple
- 778200
≈ Verde Tropa
- 008E76
≈ Observatory
Tetrada +90° +180° +270°
- A457A8
Prickly Purple
- B75E00
≈ Super Leaf Brown
- 348F3F
≈ Green Ribbon
- 0083B8
≈ Lucario Blue
Kontrast i dostępność
Ag
AANa bieli
WCAG 4.65:1 · APCA Lc 72
Ag
AANa czerni
WCAG 4.50:1 · APCA Lc 30
Najlepszy kolor tekstu: #FFFFFF
WCAG 4.65:1 (AA) · APCA Lc 72
Contrast pairs
Fragmenty kodu
CSS
:root {
--prickly-purple: #a457a8;
--prickly-purple-rgb: 164 87 168;
--prickly-purple-oklch: oklch(0.578 0.146 325.4);
}
.element {
color: var(--prickly-purple);
background-color: hsl(297 32% 50%);
border-color: oklch(0.578 0.146 325.4);
}Tailwind CSS v4
@theme {
--color-prickly-purple: #a457a8;
--color-prickly-purple-50: #ffe7ff;
--color-prickly-purple-100: #ffd7ff;
--color-prickly-purple-200: #f7bff5;
--color-prickly-purple-300: #e09cde;
--color-prickly-purple-400: #ca7ecd;
--color-prickly-purple-500: #b55fba;
--color-prickly-purple-600: #99519d;
--color-prickly-purple-700: #7b417e;
--color-prickly-purple-800: #5a2f5f;
--color-prickly-purple-900: #3f2043;
--color-prickly-purple-950: #280f2b;
}SCSS
$prickly-purple: #a457a8;
$prickly-purple-rgb: 164, 87, 168;
$prickly-purple-light: mix(#fff, $prickly-purple, 20%);
$prickly-purple-dark: mix(#000, $prickly-purple, 20%);
.element {
color: $prickly-purple;
box-shadow: 0 0 0 2px rgba($prickly-purple, 0.35);
}