Colore con nome · #51588E
Piccadilly Purple
Piccadilly Purple è #51588E: rgb(81 88 142), hsl(233 27% 44%), oklch(0.479 0.087 277). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Blue mean? → · Piccadilly Purple color name →
#51588E
oklch(0.479 0.087 277)
Conversioni di colore
- HEX
- #51588e
- RGB
- rgb(81 88 142)
- HSL
- hsl(233 27% 44%)
- HWB
- hwb(233 32% 44%)
- OKLCH
- oklch(0.479 0.087 277)
- OKLab
- oklab(0.479 0.011 -0.087)
- CIE Lab
- lab(38.67 8.44 -31.23)
- LCH
- lch(38.67 32.35 285.1)
- CMYK
- cmyk(43% 38% 0% 44%)
Tinte · Ombre · Toni
Tinte
- 606899
- 7078A5
- 8188B0
- 9298BB
- A3A9C7
- B5BAD2
- C7CBDD
- D9DCE8
- ECEDF4
Ombre
- 454B7B
- 3A3F68
- 2F3356
- 242844
- 1A1D34
- 101224
- 070915
- 020307
- 000001
Toni
- 555C8D
- 5A608C
- 5E658B
- 63698A
- 686D88
- 6C7187
- 717485
- 767884
- 7B7C82
Armonie di colore
Complementare +180°
- 51588E
Piccadilly Purple
- 6B5D19
≈ High Forest Green
Analogo -30° +30°
- 51588E
Piccadilly Purple
- 30618C
≈ Bay Site
- 6A4F84
≈ Zimidar
Triadico +120° +240°
- 51588E
Piccadilly Purple
- 874A39
≈ Brickhouse
- 2C6C49
≈ Chopped Chive
Complementare divisa +150° +210°
- 51588E
Piccadilly Purple
- 7E5320
≈ Medium Brown
- 50662D
≈ Tabbouleh Green
Tetradico +90° +180° +270°
- 51588E
Piccadilly Purple
- 864755
≈ Haunting Melody
- 6B5D19
≈ High Forest Green
- 006C65
≈ Office Blue Green
Contrasto e accessibilità
Ag
AASu bianco
WCAG 6.69:1 · APCA Lc 83
Ag
FailSu nero
WCAG 3.13:1 · APCA Lc 19
Miglior colore del testo: #FFFFFF
WCAG 6.69:1 (AA) · APCA Lc 83
Contrast pairs
Frammenti di codice
CSS
:root {
--piccadilly-purple: #51588e;
--piccadilly-purple-rgb: 81 88 142;
--piccadilly-purple-oklch: oklch(0.479 0.087 277);
}
.element {
color: var(--piccadilly-purple);
background-color: hsl(233 27% 44%);
border-color: oklch(0.479 0.087 277);
}Tailwind CSS v4
@theme {
--color-piccadilly-purple: #51588e;
--color-piccadilly-purple-50: #eff3ff;
--color-piccadilly-purple-100: #e1e6ff;
--color-piccadilly-purple-200: #ccd1fa;
--color-piccadilly-purple-300: #adb3e4;
--color-piccadilly-purple-400: #919ad2;
--color-piccadilly-purple-500: #7781c0;
--color-piccadilly-purple-600: #656da2;
--color-piccadilly-purple-700: #515782;
--color-piccadilly-purple-800: #394061;
--color-piccadilly-purple-900: #272c44;
--color-piccadilly-purple-950: #16192c;
}SCSS
$piccadilly-purple: #51588e;
$piccadilly-purple-rgb: 81, 88, 142;
$piccadilly-purple-light: mix(#fff, $piccadilly-purple, 20%);
$piccadilly-purple-dark: mix(#000, $piccadilly-purple, 20%);
.element {
color: $piccadilly-purple;
box-shadow: 0 0 0 2px rgba($piccadilly-purple, 0.35);
}