Benannte Farbe · #A8E4A0
Grape Green
Grape Green ist #A8E4A0: rgb(168 228 160), hsl(113 56% 76%), oklch(0.861 0.111 141.6). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Green mean? → · Grape Green color name →
#A8E4A0
oklch(0.861 0.111 141.6)
Farbumrechnungen
- HEX
- #a8e4a0
- RGB
- rgb(168 228 160)
- HSL
- hsl(113 56% 76%)
- HWB
- hwb(113 63% 11%)
- OKLCH
- oklch(0.861 0.111 141.6)
- OKLab
- oklab(0.861 -0.087 0.069)
- CIE Lab
- lab(85.23 -29.4 26.91)
- LCH
- lch(85.23 39.86 137.5)
- CMYK
- cmyk(26% 0% 30% 11%)
Tints · Shades · Tones
Tints
- B1E7AA
- BAEAB3
- C3EDBD
- CBEFC6
- D4F2D0
- DDF5D9
- E5F7E3
- EEFAEC
- F6FCF6
Shades
- 92C68B
- 7CA976
- 678D61
- 52724E
- 3F583B
- 2C3F29
- 1A2819
- 0A1209
- 010301
Tones
- A4DA9D
- A1CF9A
- 9DC597
- 99BB94
- 95B191
- 91A78E
- 8D9D8A
- 899387
- 848A84
Farbharmonien
Komplementär +180°
- A8E4A0
Grape Green
- F3B9FD
≈ Brilliant Lavender
Analog -30° +30°
- A8E4A0
Grape Green
- D3D981
≈ Lime Ice
- 7EE9C8
≈ Bubble Algae
Triadisch +120° +240°
- A8E4A0
Grape Green
- B9D2FF
≈ Ice Cold Stare
- FFBEBC
≈ Peach Scone
Geteilt komplementär +150° +210°
- A8E4A0
Grape Green
- D1C9FF
≈ Innocent Snowdrop
- FFBAD8
≈ Cotton Candy
Tetradisch +90° +180° +270°
- A8E4A0
Grape Green
- 98DCFF
≈ Gas Giant
- F3B9FD
≈ Brilliant Lavender
- FFC29E
≈ Coral Gable
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.47:1 · APCA Lc 22
Ag
AAAAuf Schwarz
WCAG 14.26:1 · APCA Lc 81
Beste Textfarbe: #000000
WCAG 14.26:1 (AAA) · APCA Lc 81
Contrast pairs
Code-Snippets
CSS
:root {
--grape-green: #a8e4a0;
--grape-green-rgb: 168 228 160;
--grape-green-oklch: oklch(0.861 0.111 141.6);
}
.element {
color: var(--grape-green);
background-color: hsl(113 56% 76%);
border-color: oklch(0.861 0.111 141.6);
}Tailwind CSS v4
@theme {
--color-grape-green: #a8e4a0;
--color-grape-green-50: #e3fee1;
--color-grape-green-100: #d3f2d1;
--color-grape-green-200: #b9e1b6;
--color-grape-green-300: #95c793;
--color-grape-green-400: #78af71;
--color-grape-green-500: #599851;
--color-grape-green-600: #4c8145;
--color-grape-green-700: #3c6737;
--color-grape-green-800: #2d4c25;
--color-grape-green-900: #1e3419;
--color-grape-green-950: #0e200a;
}SCSS
$grape-green: #a8e4a0;
$grape-green-rgb: 168, 228, 160;
$grape-green-light: mix(#fff, $grape-green, 20%);
$grape-green-dark: mix(#000, $grape-green, 20%);
.element {
color: $grape-green;
box-shadow: 0 0 0 2px rgba($grape-green, 0.35);
}