Najbliższy nazwany kolor · #AA88B3
#AA88B3
Najbliższy nazwany kolor: Heart Potion
#AA88B3 (rgb(170 136 179), hsl(287 22% 62%), oklch(0.673 0.073 319.1)) jest najbliższy nazwanemu kolorowi Heart Potion. Zobacz odcienie, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
#AA88B3
oklch(0.673 0.073 319.1)
Konwersje koloru
- HEX
- #aa88b3
- RGB
- rgb(170 136 179)
- HSL
- hsl(287 22% 62%)
- HWB
- hwb(287 53% 30%)
- OKLCH
- oklch(0.673 0.073 319.1)
- OKLab
- oklab(0.673 0.055 -0.048)
- CIE Lab
- lab(61.07 19.16 -17.6)
- LCH
- lch(61.07 26.02 317.4)
- CMYK
- cmyk(5% 24% 0% 30%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- B293BB
- BB9FC2
- C3ABCA
- CCB6D1
- D4C2D9
- DDCEE0
- E5DAE8
- EEE6F0
- F6F3F7
Odcienie ciemniejsze
- 93759B
- 7D6384
- 68526E
- 534158
- 3F3143
- 2D222F
- 1B131D
- 0B060C
- 010101
Tony
- A687AE
- A287A9
- 9D86A4
- 99859F
- 958499
- 918494
- 8D838F
- 88828A
- 848185
Harmonie kolorów
Komplementarna +180°
- AA88B3
Heart Potion
- 7FA176
≈ Green Grey
Analogowa -30° +30°
- AA88B3
Heart Potion
- 948FC1
≈ Hermosa
- B9849D
≈ Mauvey Nude
Triada +120° +240°
- AA88B3
Heart Potion
- AF9162
≈ Pirate Plunder
- 5BA4A7
≈ Twilight Meadow
Komplementarna rozszczepiona +150° +210°
- AA88B3
Heart Potion
- 999A65
≈ Hiking
- 67A58F
≈ Quilotoa Green
Tetrada +90° +180° +270°
- AA88B3
Heart Potion
- BC896E
≈ Foxtail
- 7FA176
≈ Green Grey
- 659FBA
≈ Lake Lucerne
Kontrast i dostępność
Ag
FailNa bieli
WCAG 3.05:1 · APCA Lc 57
Ag
AANa czerni
WCAG 6.88:1 · APCA Lc 44
Najlepszy kolor tekstu: #000000
WCAG 6.88:1 (AA) · APCA Lc 44
Contrast pairs
Fragmenty kodu
CSS
:root {
--heart-potion: #aa88b3;
--heart-potion-rgb: 170 136 179;
--heart-potion-oklch: oklch(0.673 0.073 319.1);
}
.element {
color: var(--heart-potion);
background-color: hsl(287 22% 62%);
border-color: oklch(0.673 0.073 319.1);
}Tailwind CSS v4
@theme {
--color-heart-potion: #aa88b3;
--color-heart-potion-50: #ffefff;
--color-heart-potion-100: #f4e0f7;
--color-heart-potion-200: #e3cbe8;
--color-heart-potion-300: #c9acce;
--color-heart-potion-400: #b291ba;
--color-heart-potion-500: #9b77a5;
--color-heart-potion-600: #83658b;
--color-heart-potion-700: #695070;
--color-heart-potion-800: #4d3a53;
--color-heart-potion-900: #35283a;
--color-heart-potion-950: #201624;
}SCSS
$heart-potion: #aa88b3;
$heart-potion-rgb: 170, 136, 179;
$heart-potion-light: mix(#fff, $heart-potion, 20%);
$heart-potion-dark: mix(#000, $heart-potion, 20%);
.element {
color: $heart-potion;
box-shadow: 0 0 0 2px rgba($heart-potion, 0.35);
}