Couleur nommée · #AA23FF
Cool Purple
Cool Purple correspond à #AA23FF : rgb(170 35 255), hsl(277 100% 57%), oklch(0.592 0.287 306.3). Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
What does Purple mean? → · Cool Purple color name →
#AA23FF
oklch(0.592 0.287 306.3)
Conversions de couleur
- HEX
- #aa23ff
- RGB
- rgb(170 35 255)
- HSL
- hsl(277 100% 57%)
- HWB
- hwb(277 14% 0%)
- OKLCH
- oklch(0.592 0.287 306.3)
- OKLab
- oklab(0.592 0.17 -0.231)
- CIE Lab
- lab(47.25 75.27 -82.19)
- LCH
- lch(47.25 111.45 312.5)
- CMYK
- cmyk(33% 86% 0% 0%)
Teintes · Ombres · Tons
Teintes
- B24AFF
- BA64FF
- C37BFF
- CB8FFF
- D4A3FF
- DCB6FF
- E5C9FF
- EEDBFF
- F6EDFF
Ombres
- 931DDE
- 7D17BE
- 68119E
- 530C80
- 3F0763
- 2D0448
- 1B012E
- 0B0016
- 010003
Tons
- A63AF3
- A149E7
- 9D54DA
- 995DCE
- 9565C2
- 916CB5
- 8C72A8
- 88779B
- 847C8E
Harmonies de couleurs
Complémentaire +180°
- AA23FF
Cool Purple
- 678D00
≈ Asparagus Sultan
Analogue -30° +30°
- AA23FF
Cool Purple
- 6164FF
≈ Blue Genie
- D300B6
≈ Explosive Purple
Triadique +120° +240°
- AA23FF
Cool Purple
- B16B00
≈ Caramel
- 009187
≈ Nifty Turquoise
Complémentaire divisée +150° +210°
- AA23FF
Cool Purple
- 937D00
≈ Moscow Papyrus
- 009659
≈ Green Gloss
Tétradique +90° +180° +270°
- AA23FF
Cool Purple
- DB3E00
≈ Torii Red
- 678D00
≈ Asparagus Sultan
- 008DA6
≈ Quintana
Contraste et accessibilité
Ag
AASur blanc
WCAG 4.77:1 · APCA Lc 71
Ag
FailSur noir
WCAG 4.39:1 · APCA Lc 30
Meilleure couleur de texte: #FFFFFF
WCAG 4.77:1 (AA) · APCA Lc 71
Contrast pairs
Extraits de code
CSS
:root {
--cool-purple: #aa23ff;
--cool-purple-rgb: 170 35 255;
--cool-purple-oklch: oklch(0.592 0.287 306.3);
}
.element {
color: var(--cool-purple);
background-color: hsl(277 100% 57%);
border-color: oklch(0.592 0.287 306.3);
}Tailwind CSS v4
@theme {
--color-cool-purple: #aa23ff;
--color-cool-purple-50: #ffdfff;
--color-cool-purple-100: #ffcdff;
--color-cool-purple-200: #f7afff;
--color-cool-purple-300: #e186ff;
--color-cool-purple-400: #ca5cff;
--color-cool-purple-500: #b70eff;
--color-cool-purple-600: #9b18ea;
--color-cool-purple-700: #7c15bc;
--color-cool-purple-800: #5a0e90;
--color-cool-purple-900: #3f0a66;
--color-cool-purple-950: #280046;
}SCSS
$cool-purple: #aa23ff;
$cool-purple-rgb: 170, 35, 255;
$cool-purple-light: mix(#fff, $cool-purple, 20%);
$cool-purple-dark: mix(#000, $cool-purple, 20%);
.element {
color: $cool-purple;
box-shadow: 0 0 0 2px rgba($cool-purple, 0.35);
}