Najbliższy nazwany kolor · #AE00EC
#AE00EC
Najbliższy nazwany kolor: Vibrant Purple
#AE00EC (rgb(174 0 236), hsl(284 100% 46%), oklch(0.571 0.286 312.2)) jest najbliższy nazwanemu kolorowi Vibrant Purple. Zobacz odcienie, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
#AE00EC
oklch(0.571 0.286 312.2)
Konwersje koloru
- HEX
- #ae00ec
- RGB
- rgb(174 0 236)
- HSL
- hsl(284 100% 46%)
- HWB
- hwb(284 0% 7%)
- OKLCH
- oklch(0.571 0.286 312.2)
- OKLab
- oklab(0.571 0.192 -0.211)
- CIE Lab
- lab(44.94 77.82 -75.26)
- LCH
- lch(44.94 108.26 316)
- CMYK
- cmyk(26% 100% 0% 7%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- B73DF0
- BF5AF3
- C872F6
- D088F9
- D89DFB
- E0B1FD
- E8C5FE
- F0D8FF
- F7ECFF
Odcienie ciemniejsze
- 9700CD
- 8000AF
- 6A0092
- 550076
- 41005B
- 2E0042
- 1C0029
- 0B0013
- 010003
Tony
- AA2BE2
- A53ED8
- A14CCD
- 9D56C3
- 9860B8
- 9468AE
- 8F6FA3
- 8A7597
- 857B8C
Harmonie kolorów
Komplementarna +180°
- AE00EC
Vibrant Purple
- 528A00
≈ Pesto Alla Genovese
Analogowa -30° +30°
- AE00EC
Vibrant Purple
- 6B52FF
≈ Venetian Nights
- CE009E
≈ Indian Lake
Triada +120° +240°
- AE00EC
Vibrant Purple
- A36A00
≈ Komodo
- 008A87
≈ Navigate
Komplementarna rozszczepiona +150° +210°
- AE00EC
Vibrant Purple
- 867900
≈ Soft Fig
- 008E61
≈ Chagall Green
Tetrada +90° +180° +270°
- AE00EC
Vibrant Purple
- C64A00
≈ Brick Orange
- 528A00
≈ Pesto Alla Genovese
- 0085A4
≈ Azores Blue
Kontrast i dostępność
Ag
AANa bieli
WCAG 5.23:1 · APCA Lc 73
Ag
FailNa czerni
WCAG 4.01:1 · APCA Lc 28
Najlepszy kolor tekstu: #FFFFFF
WCAG 5.23:1 (AA) · APCA Lc 73
Contrast pairs
Fragmenty kodu
CSS
:root {
--vibrant-purple: #ae00ec;
--vibrant-purple-rgb: 174 0 236;
--vibrant-purple-oklch: oklch(0.571 0.286 312.2);
}
.element {
color: var(--vibrant-purple);
background-color: hsl(284 100% 46%);
border-color: oklch(0.571 0.286 312.2);
}Tailwind CSS v4
@theme {
--color-vibrant-purple: #ae00ec;
--color-vibrant-purple-50: #ffddff;
--color-vibrant-purple-100: #ffcbff;
--color-vibrant-purple-200: #ffacff;
--color-vibrant-purple-300: #eb81ff;
--color-vibrant-purple-400: #d556ff;
--color-vibrant-purple-500: #c300ff;
--color-vibrant-purple-600: #a509df;
--color-vibrant-purple-700: #840cb3;
--color-vibrant-purple-800: #600889;
--color-vibrant-purple-900: #430761;
--color-vibrant-purple-950: #2c0043;
}SCSS
$vibrant-purple: #ae00ec;
$vibrant-purple-rgb: 174, 0, 236;
$vibrant-purple-light: mix(#fff, $vibrant-purple, 20%);
$vibrant-purple-dark: mix(#000, $vibrant-purple, 20%);
.element {
color: $vibrant-purple;
box-shadow: 0 0 0 2px rgba($vibrant-purple, 0.35);
}