Colore con nome · #6633BB
Purple Emperor
Purple Emperor è #6633BB: rgb(102 51 187), hsl(263 57% 47%), oklch(0.468 0.199 294.5). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Purple mean? → · Purple Emperor color name →
#6633BB
oklch(0.468 0.199 294.5)
Conversioni di colore
- HEX
- #6633bb
- RGB
- rgb(102 51 187)
- HSL
- hsl(263 57% 47%)
- HWB
- hwb(263 20% 27%)
- OKLCH
- oklch(0.468 0.199 294.5)
- OKLab
- oklab(0.468 0.083 -0.181)
- CIE Lab
- lab(34.68 45.44 -64.29)
- LCH
- lch(34.68 78.73 305.2)
- CMYK
- cmyk(45% 73% 0% 27%)
Tinte · Ombre · Toni
Tinte
- 734BC3
- 8061CB
- 8F75D3
- 9D89DA
- AD9DE1
- BCB0E8
- CCC4EE
- DDD7F4
- EEEBFA
Ombre
- 582BA2
- 4A238A
- 3C1C73
- 2F145C
- 230D46
- 170732
- 0C031F
- 04010D
- 000002
Toni
- 683FB6
- 6A48B1
- 6C51AC
- 6E59A6
- 7160A0
- 74679B
- 766E94
- 79748E
- 7D7A87
Armonie di colore
Complementare +180°
- 6633BB
Purple Emperor
- 596000
≈ Kirchner Green
Analogo -30° +30°
- 6633BB
Purple Emperor
- 1F4BC7
≈ New Car
- 8C1B96
≈ Passionate Purple
Triadico +120° +240°
- 6633BB
Purple Emperor
- 8A4400
≈ Chocolate Pancakes
- 006A57
≈ Chrysocolla Medium Green
Complementare divisa +150° +210°
- 6633BB
Purple Emperor
- 735500
≈ Pickled Grape Leaves
- 006E17
≈ Bogey Green
Tetradico +90° +180° +270°
- 6633BB
Purple Emperor
- AB001B
≈ Incarnadine
- 596000
≈ Kirchner Green
- 00676F
≈ Trouser Blue
Contrasto e accessibilità
Ag
AAASu bianco
WCAG 7.61:1 · APCA Lc 86
Ag
FailSu nero
WCAG 2.75:1 · APCA Lc 16
Miglior colore del testo: #FFFFFF
WCAG 7.61:1 (AAA) · APCA Lc 86
Contrast pairs
Frammenti di codice
CSS
:root {
--purple-emperor: #6633bb;
--purple-emperor-rgb: 102 51 187;
--purple-emperor-oklch: oklch(0.468 0.199 294.5);
}
.element {
color: var(--purple-emperor);
background-color: hsl(263 57% 47%);
border-color: oklch(0.468 0.199 294.5);
}Tailwind CSS v4
@theme {
--color-purple-emperor: #6633bb;
--color-purple-emperor-50: #faeaff;
--color-purple-emperor-100: #eedbff;
--color-purple-emperor-200: #dcc2ff;
--color-purple-emperor-300: #c2a0ff;
--color-purple-emperor-400: #a881ff;
--color-purple-emperor-500: #935ff9;
--color-purple-emperor-600: #7c52d2;
--color-purple-emperor-700: #6341a9;
--color-purple-emperor-800: #472f80;
--color-purple-emperor-900: #31205a;
--color-purple-emperor-950: #1d0f3d;
}SCSS
$purple-emperor: #6633bb;
$purple-emperor-rgb: 102, 51, 187;
$purple-emperor-light: mix(#fff, $purple-emperor, 20%);
$purple-emperor-dark: mix(#000, $purple-emperor, 20%);
.element {
color: $purple-emperor;
box-shadow: 0 0 0 2px rgba($purple-emperor, 0.35);
}