Colore con nome più vicino · #B500DC
#B500DC
Colore con nome più vicino: Vibrant Purple
#B500DC (rgb(181 0 220), hsl(289 100% 43%), oklch(0.569 0.276 318)) è più vicino al colore con nome Vibrant Purple. Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
#B500DC
oklch(0.569 0.276 318)
Conversioni di colore
- HEX
- #b500dc
- RGB
- rgb(181 0 220)
- HSL
- hsl(289 100% 43%)
- HWB
- hwb(289 0% 14%)
- OKLCH
- oklch(0.569 0.276 318)
- OKLab
- oklab(0.569 0.205 -0.185)
- CIE Lab
- lab(45.11 76.86 -65.84)
- LCH
- lch(45.11 101.2 319.4)
- CMYK
- cmyk(18% 100% 0% 14%)
Tinte · Ombre · Toni
Tinte
- BE3BE1
- C658E6
- CE70EA
- D686EE
- DD9BF2
- E5B0F5
- ECC4F8
- F2D8FB
- F9EBFD
Ombre
- 9D00BF
- 8600A3
- 6F0088
- 59006E
- 440054
- 30003C
- 1D0026
- 0C0011
- 020002
Toni
- B02AD3
- AC3DCB
- A74AC2
- A255B9
- 9D5EB0
- 9866A7
- 926E9E
- 8C7494
- 867A8A
Armonie di colore
Complementare +180°
- B500DC
Vibrant Purple
- 388D00
≈ Christmas Green
Analogo -30° +30°
- B500DC
Vibrant Purple
- 7947FF
≈ Venetian Nights
- D1008F
≈ Snappy Violet
Triadico +120° +240°
- B500DC
Vibrant Purple
- 9D6D00
≈ Balor Brown
- 00888C
≈ Well Blue
Complementare divisa +150° +210°
- B500DC
Vibrant Purple
- 7F7C00
≈ Olive
- 008C6A
≈ Indonesian Jungle
Tetradico +90° +180° +270°
- B500DC
Vibrant Purple
- BD5300
≈ Obscure Orange
- 388D00
≈ Christmas Green
- 0083AA
≈ Advertising Blue
Contrasto e accessibilità
Ag
AASu bianco
WCAG 5.25:1 · APCA Lc 74
Ag
FailSu nero
WCAG 3.99:1 · APCA Lc 28
Miglior colore del testo: #FFFFFF
WCAG 5.25:1 (AA) · APCA Lc 74
Contrast pairs
Frammenti di codice
CSS
:root {
--vibrant-purple: #b500dc;
--vibrant-purple-rgb: 181 0 220;
--vibrant-purple-oklch: oklch(0.569 0.276 318);
}
.element {
color: var(--vibrant-purple);
background-color: hsl(289 100% 43%);
border-color: oklch(0.569 0.276 318);
}Tailwind CSS v4
@theme {
--color-vibrant-purple: #b500dc;
--color-vibrant-purple-50: #ffdcff;
--color-vibrant-purple-100: #ffc9ff;
--color-vibrant-purple-200: #ffabff;
--color-vibrant-purple-300: #f380ff;
--color-vibrant-purple-400: #de55ff;
--color-vibrant-purple-500: #cc00f8;
--color-vibrant-purple-600: #ac0bd1;
--color-vibrant-purple-700: #8a0da8;
--color-vibrant-purple-800: #650880;
--color-vibrant-purple-900: #47075b;
--color-vibrant-purple-950: #2e003e;
}SCSS
$vibrant-purple: #b500dc;
$vibrant-purple-rgb: 181, 0, 220;
$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);
}