Colore con nome · #AD03DE
Vibrant Purple
Vibrant Purple è #AD03DE: rgb(173 3 222), hsl(287 97% 44%), oklch(0.56 0.274 315.1). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Purple mean? → · Vibrant Purple color name →
#AD03DE
oklch(0.56 0.274 315.1)
Conversioni di colore
- HEX
- #ad03de
- RGB
- rgb(173 3 222)
- HSL
- hsl(287 97% 44%)
- HWB
- hwb(287 1% 13%)
- OKLCH
- oklch(0.56 0.274 315.1)
- OKLab
- oklab(0.56 0.194 -0.194)
- CIE Lab
- lab(43.93 75.54 -68.97)
- LCH
- lch(43.93 102.29 317.6)
- CMYK
- cmyk(22% 99% 0% 13%)
Tinte · Ombre · Toni
Tinte
- B63CE3
- BF58E8
- C870EC
- D086F0
- D89BF3
- E0B0F6
- E8C4F9
- F0D8FC
- F8EBFE
Ombre
- 9602C1
- 7F02A5
- 6A0189
- 55016F
- 410055
- 2D003D
- 1B0026
- 0B0012
- 010002
Toni
- A92BD5
- A53DCC
- A14AC3
- 9D55BA
- 985EB1
- 9466A8
- 8F6E9E
- 8A7495
- 857A8A
Armonie di colore
Complementare +180°
- AD03DE
Vibrant Purple
- 458800
≈ Mughal Green
Analogo -30° +30°
- AD03DE
Vibrant Purple
- 7046FF
≈ Pink OCD
- CA0093
≈ Indian Lake
Triadico +120° +240°
- AD03DE
Vibrant Purple
- 9C6800
≈ Balor Brown
- 008586
≈ Bay Teal
Complementare divisa +150° +210°
- AD03DE
Vibrant Purple
- 7F7700
≈ Tool Green
- 008963
≈ Absinthe Turquoise
Tetradico +90° +180° +270°
- AD03DE
Vibrant Purple
- BC4D00
≈ Crustose Lichen
- 458800
≈ Mughal Green
- 0080A3
≈ Kingfisher Sheen
Contrasto e accessibilità
Ag
AASu bianco
WCAG 5.46:1 · APCA Lc 75
Ag
FailSu nero
WCAG 3.84:1 · APCA Lc 27
Miglior colore del testo: #FFFFFF
WCAG 5.46:1 (AA) · APCA Lc 75
Contrast pairs
Frammenti di codice
CSS
:root {
--vibrant-purple: #ad03de;
--vibrant-purple-rgb: 173 3 222;
--vibrant-purple-oklch: oklch(0.56 0.274 315.1);
}
.element {
color: var(--vibrant-purple);
background-color: hsl(287 97% 44%);
border-color: oklch(0.56 0.274 315.1);
}Tailwind CSS v4
@theme {
--color-vibrant-purple: #ad03de;
--color-vibrant-purple-50: #ffddff;
--color-vibrant-purple-100: #ffcbff;
--color-vibrant-purple-200: #ffacff;
--color-vibrant-purple-300: #ee82ff;
--color-vibrant-purple-400: #d958ff;
--color-vibrant-purple-500: #c60bfd;
--color-vibrant-purple-600: #a715d6;
--color-vibrant-purple-700: #8613ac;
--color-vibrant-purple-800: #620d83;
--color-vibrant-purple-900: #45095d;
--color-vibrant-purple-950: #2c003f;
}SCSS
$vibrant-purple: #ad03de;
$vibrant-purple-rgb: 173, 3, 222;
$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);
}