Benannte Farbe · #AB98A9
Heliotrope Grey
Heliotrope Grey ist #AB98A9: rgb(171 152 169), hsl(306 10% 63%), oklch(0.702 0.033 329.3). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Gray mean? → · Heliotrope Grey color name →
#AB98A9
oklch(0.702 0.033 329.3)
Farbumrechnungen
- HEX
- #ab98a9
- RGB
- rgb(171 152 169)
- HSL
- hsl(306 10% 63%)
- HWB
- hwb(306 60% 33%)
- OKLCH
- oklch(0.702 0.033 329.3)
- OKLab
- oklab(0.702 0.028 -0.017)
- CIE Lab
- lab(64.94 9.55 -6.21)
- LCH
- lch(64.94 11.4 327)
- CMYK
- cmyk(0% 11% 1% 33%)
Tints · Shades · Tones
Tints
- B3A2B1
- BBACBA
- C4B6C2
- CCC0CB
- D4CAD3
- DDD5DC
- E5DFE5
- EEEAED
- F6F4F6
Shades
- 948492
- 7E707C
- 685C67
- 544A53
- 40383F
- 2D272C
- 1B171B
- 0B080A
- 010101
Tones
- A796A5
- A293A1
- 9E919D
- 9A8E98
- 958C94
- 918A90
- 8D878C
- 888588
- 848284
Farbharmonien
Komplementär +180°
- AB98A9
Heliotrope Grey
- 91A594
≈ Heavenly Garden
Analog -30° +30°
- AB98A9
Heliotrope Grey
- A19BB1
≈ Logan
- B1979E
≈ Deep South
Triadisch +120° +240°
- AB98A9
Heliotrope Grey
- A79E88
≈ Tent Green
- 88A5AA
≈ Impressionist
Geteilt komplementär +150° +210°
- AB98A9
Heliotrope Grey
- 9CA28C
≈ Meadowood
- 8AA69F
≈ Tropical Cascade
Tetradisch +90° +180° +270°
- AB98A9
Heliotrope Grey
- AF9B8B
≈ Woodland Stone
- 91A594
≈ Heavenly Garden
- 8DA2B1
≈ Favourite Jeans
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 2.69:1 · APCA Lc 52
Ag
AAAAuf Schwarz
WCAG 7.79:1 · APCA Lc 50
Beste Textfarbe: #000000
WCAG 7.79:1 (AAA) · APCA Lc 50
Contrast pairs
Code-Snippets
CSS
:root {
--heliotrope-grey: #ab98a9;
--heliotrope-grey-rgb: 171 152 169;
--heliotrope-grey-oklch: oklch(0.702 0.033 329.3);
}
.element {
color: var(--heliotrope-grey);
background-color: hsl(306 10% 63%);
border-color: oklch(0.702 0.033 329.3);
}Tailwind CSS v4
@theme {
--color-heliotrope-grey: #ab98a9;
--color-heliotrope-grey-50: #fbf2f9;
--color-heliotrope-grey-100: #efe4ed;
--color-heliotrope-grey-200: #ddcfdb;
--color-heliotrope-grey-300: #c2b2bf;
--color-heliotrope-grey-400: #aa98a8;
--color-heliotrope-grey-500: #937f91;
--color-heliotrope-grey-600: #7c6b7b;
--color-heliotrope-grey-700: #635662;
--color-heliotrope-grey-800: #493f48;
--color-heliotrope-grey-900: #322b32;
--color-heliotrope-grey-950: #1e181e;
}SCSS
$heliotrope-grey: #ab98a9;
$heliotrope-grey-rgb: 171, 152, 169;
$heliotrope-grey-light: mix(#fff, $heliotrope-grey, 20%);
$heliotrope-grey-dark: mix(#000, $heliotrope-grey, 20%);
.element {
color: $heliotrope-grey;
box-shadow: 0 0 0 2px rgba($heliotrope-grey, 0.35);
}