Benannte Farbe · #988EB4
Purple Agate
Purple Agate ist #988EB4: rgb(152 142 180), hsl(256 20% 63%), oklch(0.669 0.057 296.9). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Purple mean? → · Purple Agate color name →
#988EB4
oklch(0.669 0.057 296.9)
Farbumrechnungen
- HEX
- #988eb4
- RGB
- rgb(152 142 180)
- HSL
- hsl(256 20% 63%)
- HWB
- hwb(256 56% 29%)
- OKLCH
- oklch(0.669 0.057 296.9)
- OKLab
- oklab(0.669 0.026 -0.05)
- CIE Lab
- lab(60.91 9.69 -18.6)
- LCH
- lch(60.91 20.98 297.5)
- CMYK
- cmyk(16% 21% 0% 29%)
Tints · Shades · Tones
Tints
- A299BB
- ACA4C3
- B6AFCA
- C0BAD2
- CAC5D9
- D5D1E1
- DFDCE8
- EAE8F0
- F4F3F7
Shades
- 847B9C
- 706885
- 5C566E
- 4A4458
- 383444
- 272430
- 17151D
- 08070C
- 010102
Tones
- 968DAF
- 938BAA
- 918AA4
- 8E899F
- 8C879A
- 898695
- 878490
- 85838A
- 828185
Farbharmonien
Komplementär +180°
- 988EB4
Purple Agate
- 929A72
≈ Alamosa Green
Analog -30° +30°
- 988EB4
Purple Agate
- 8594B8
≈ Soothsayer
- A889A7
≈ Lavender Herb
Triadisch +120° +240°
- 988EB4
Purple Agate
- B08C73
≈ Homeland
- 6FA194
≈ Jade Dragon
Geteilt komplementär +150° +210°
- 988EB4
Purple Agate
- A4936D
≈ Gristmill
- 7E9F81
≈ Aquadulce
Tetradisch +90° +180° +270°
- 988EB4
Purple Agate
- B58882
≈ Toki Brown
- 929A72
≈ Alamosa Green
- 6B9FA6
≈ Reef Waters
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 3.05:1 · APCA Lc 57
Ag
AAAuf Schwarz
WCAG 6.86:1 · APCA Lc 44
Beste Textfarbe: #000000
WCAG 6.86:1 (AA) · APCA Lc 44
Contrast pairs
Code-Snippets
CSS
:root {
--purple-agate: #988eb4;
--purple-agate-rgb: 152 142 180;
--purple-agate-oklch: oklch(0.669 0.057 296.9);
}
.element {
color: var(--purple-agate);
background-color: hsl(256 20% 63%);
border-color: oklch(0.669 0.057 296.9);
}Tailwind CSS v4
@theme {
--color-purple-agate: #988eb4;
--color-purple-agate-50: #f7f2ff;
--color-purple-agate-100: #eae4f9;
--color-purple-agate-200: #d7cfea;
--color-purple-agate-300: #bbb2d1;
--color-purple-agate-400: #a198bc;
--color-purple-agate-500: #8a7fa8;
--color-purple-agate-600: #746b8e;
--color-purple-agate-700: #5d5672;
--color-purple-agate-800: #433f54;
--color-purple-agate-900: #2f2b3b;
--color-purple-agate-950: #1b1825;
}SCSS
$purple-agate: #988eb4;
$purple-agate-rgb: 152, 142, 180;
$purple-agate-light: mix(#fff, $purple-agate, 20%);
$purple-agate-dark: mix(#000, $purple-agate, 20%);
.element {
color: $purple-agate;
box-shadow: 0 0 0 2px rgba($purple-agate, 0.35);
}