Nazwany kolor · #8822BB
Pheromone Purple
Pheromone Purple to #8822BB: rgb(136 34 187), hsl(280 69% 43%), oklch(0.493 0.222 310.7). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Purple mean? → · Pheromone Purple color name →
#8822BB
oklch(0.493 0.222 310.7)
Konwersje koloru
- HEX
- #8822bb
- RGB
- rgb(136 34 187)
- HSL
- hsl(280 69% 43%)
- HWB
- hwb(280 13% 27%)
- OKLCH
- oklch(0.493 0.222 310.7)
- OKLab
- oklab(0.493 0.145 -0.168)
- CIE Lab
- lab(37.18 58.94 -59.97)
- LCH
- lch(37.18 84.09 314.5)
- CMYK
- cmyk(27% 82% 0% 27%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 9441C3
- 9F59CB
- AB6FD3
- B784DA
- C399E1
- CFADE8
- DBC1EE
- E7D6F4
- F3EAFA
Odcienie ciemniejsze
- 751CA2
- 63168A
- 521173
- 410B5C
- 310746
- 220332
- 13011F
- 06000D
- 010002
Tony
- 8733B6
- 8740B1
- 864BAB
- 8654A6
- 855CA0
- 84649A
- 836C94
- 82738E
- 817A87
Harmonie kolorów
Komplementarna +180°
- 8822BB
Pheromone Purple
- 466F00
≈ Forest Empress
Analogowa -30° +30°
- 8822BB
Pheromone Purple
- 543FD9
≈ Blurple
- A80085
≈ Blissful Berry
Triada +120° +240°
- 8822BB
Pheromone Purple
- 875500
≈ Spear Shaft
- 00706C
≈ Pine Scented Lagoon
Komplementarna rozszczepiona +150° +210°
- 8822BB
Pheromone Purple
- 6E6200
≈ Green Brown
- 00744C
≈ Gnarls Green
Tetrada +90° +180° +270°
- 8822BB
Pheromone Purple
- A53900
≈ Muddy
- 466F00
≈ Forest Empress
- 006C85
≈ Arabian Nights
Kontrast i dostępność
Ag
AAANa bieli
WCAG 7.01:1 · APCA Lc 83
Ag
FailNa czerni
WCAG 2.99:1 · APCA Lc 19
Najlepszy kolor tekstu: #FFFFFF
WCAG 7.01:1 (AAA) · APCA Lc 83
Contrast pairs
Fragmenty kodu
CSS
:root {
--pheromone-purple: #8822bb;
--pheromone-purple-rgb: 136 34 187;
--pheromone-purple-oklch: oklch(0.493 0.222 310.7);
}
.element {
color: var(--pheromone-purple);
background-color: hsl(280 69% 43%);
border-color: oklch(0.493 0.222 310.7);
}Tailwind CSS v4
@theme {
--color-pheromone-purple: #8822bb;
--color-pheromone-purple-50: #ffe3ff;
--color-pheromone-purple-100: #ffd3ff;
--color-pheromone-purple-200: #f5b7ff;
--color-pheromone-purple-300: #de92ff;
--color-pheromone-purple-400: #c770fd;
--color-pheromone-purple-500: #b447ef;
--color-pheromone-purple-600: #983eca;
--color-pheromone-purple-700: #7a32a2;
--color-pheromone-purple-800: #58247b;
--color-pheromone-purple-900: #3e1857;
--color-pheromone-purple-950: #27073b;
}SCSS
$pheromone-purple: #8822bb;
$pheromone-purple-rgb: 136, 34, 187;
$pheromone-purple-light: mix(#fff, $pheromone-purple, 20%);
$pheromone-purple-dark: mix(#000, $pheromone-purple, 20%);
.element {
color: $pheromone-purple;
box-shadow: 0 0 0 2px rgba($pheromone-purple, 0.35);
}