Nazwany kolor · #AA66FF
Purple Hedonist
Purple Hedonist to #AA66FF: rgb(170 102 255), hsl(267 100% 70%), oklch(0.656 0.219 301). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Purple mean? → · Purple Hedonist color name →
#AA66FF
oklch(0.656 0.219 301)
Konwersje koloru
- HEX
- #aa66ff
- RGB
- rgb(170 102 255)
- HSL
- hsl(267 100% 70%)
- HWB
- hwb(267 40% 0%)
- OKLCH
- oklch(0.656 0.219 301)
- OKLab
- oklab(0.656 0.113 -0.188)
- CIE Lab
- lab(56.62 50.18 -67.03)
- LCH
- lch(56.62 83.73 306.8)
- CMYK
- cmyk(33% 60% 0% 0%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- B278FF
- BA88FF
- C298FF
- CAA7FF
- D3B6FF
- DBC5FF
- E4D4FF
- EDE2FF
- F6F1FF
Odcienie ciemniejsze
- 9358DE
- 7D4ABE
- 683C9E
- 532F80
- 3F2363
- 2D1748
- 1B0C2E
- 0B0416
- 010003
Tony
- A56BF2
- A16FE6
- 9D73D9
- 9876CD
- 9478C0
- 907AB4
- 8C7CA7
- 887E9A
- 847F8D
Harmonie kolorów
Komplementarna +180°
- AA66FF
Purple Hedonist
- 849E00
≈ Noxious
Analogowa -30° +30°
- AA66FF
Purple Hedonist
- 6A85FF
≈ Deep Denim
- D850CD
≈ Fuchsia Flash
Triada +120° +240°
- AA66FF
Purple Hedonist
- D27700
≈ Autumn Leaf Orange
- 00A895
≈ Persian Green
Komplementarna rozszczepiona +150° +210°
- AA66FF
Purple Hedonist
- B08D00
≈ Cobra Leather
- 00AE54
≈ Rita Repulsa
Tetrada +90° +180° +270°
- AA66FF
Purple Hedonist
- FA472F
≈ Strawberry Spinach Red
- 849E00
≈ Noxious
- 00A3B8
≈ January Blue
Kontrast i dostępność
Ag
FailNa bieli
WCAG 3.46:1 · APCA Lc 62
Ag
AANa czerni
WCAG 6.05:1 · APCA Lc 40
Najlepszy kolor tekstu: #000000
WCAG 6.05:1 (AA) · APCA Lc 40
Contrast pairs
Fragmenty kodu
CSS
:root {
--purple-hedonist: #aa66ff;
--purple-hedonist-rgb: 170 102 255;
--purple-hedonist-oklch: oklch(0.656 0.219 301);
}
.element {
color: var(--purple-hedonist);
background-color: hsl(267 100% 70%);
border-color: oklch(0.656 0.219 301);
}Tailwind CSS v4
@theme {
--color-purple-hedonist: #aa66ff;
--color-purple-hedonist-50: #ffe7ff;
--color-purple-hedonist-100: #f6d6ff;
--color-purple-hedonist-200: #e7bdff;
--color-purple-hedonist-300: #ce98ff;
--color-purple-hedonist-400: #b678ff;
--color-purple-hedonist-500: #a252fd;
--color-purple-hedonist-600: #8947d5;
--color-purple-hedonist-700: #6d38ab;
--color-purple-hedonist-800: #4f2982;
--color-purple-hedonist-900: #371c5c;
--color-purple-hedonist-950: #220a3f;
}SCSS
$purple-hedonist: #aa66ff;
$purple-hedonist-rgb: 170, 102, 255;
$purple-hedonist-light: mix(#fff, $purple-hedonist, 20%);
$purple-hedonist-dark: mix(#000, $purple-hedonist, 20%);
.element {
color: $purple-hedonist;
box-shadow: 0 0 0 2px rgba($purple-hedonist, 0.35);
}