Named color · #A5CF8C
Pistachio Dream
Pistachio Dream is #A5CF8C: rgb(165 207 140), hsl(98 41% 68%), oklch(0.808 0.101 134.3). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Green mean? → · Pistachio Dream color name →
#A5CF8C
oklch(0.808 0.101 134.3)
Color conversions
- HEX
- #a5cf8c
- RGB
- rgb(165 207 140)
- HSL
- hsl(98 41% 68%)
- HWB
- hwb(98 55% 19%)
- OKLCH
- oklch(0.808 0.101 134.3)
- OKLab
- oklab(0.808 -0.071 0.072)
- CIE Lab
- lab(78.86 -23.4 28.68)
- LCH
- lch(78.86 37.02 129.2)
- CMYK
- cmyk(20% 0% 32% 19%)
Tints · Shades · Tones
Tints
- AED498
- B7D9A3
- C0DEAF
- C9E2BA
- D2E7C6
- DBECD1
- E4F1DD
- EDF6E8
- F6FAF3
Shades
- 8FB479
- 799967
- 657F55
- 516743
- 3D4F33
- 2B3823
- 1A2314
- 0A1007
- 010201
Tones
- A1C78B
- 9EBF8A
- 9AB789
- 96AF88
- 93A787
- 8F9F86
- 8B9785
- 888F83
- 848882
Color harmonies
Complementary +180°
- A5CF8C
Pistachio Dream
- D8ADEE
≈ Petal Plush
Analogous -30° +30°
- A5CF8C
Pistachio Dream
- CAC475
≈ Mélange Green
- 7ED5AF
≈ Tadorna Teal
Triadic +120° +240°
- A5CF8C
Pistachio Dream
- 94C4FF
≈ Pastel Blue
- FAA5AC
≈ Simple Pink
Split-complementary +150° +210°
- A5CF8C
Pistachio Dream
- B8B8FF
≈ Greyish Lavender
- EFA6D0
≈ Elastic Pink
Tetradic +90° +180° +270°
- A5CF8C
Pistachio Dream
- 71CEF1
≈ Heisenberg Blue
- D8ADEE
≈ Petal Plush
- F8AB8A
≈ October Haze
Contrast & accessibility
Ag
FailOn white
WCAG 1.76:1 · APCA Lc 32
Ag
AAAOn black
WCAG 11.90:1 · APCA Lc 70
Best text color: #000000
WCAG 11.90:1 (AAA) · APCA Lc 70
Contrast pairs
Code snippets
CSS
:root {
--pistachio-dream: #a5cf8c;
--pistachio-dream-rgb: 165 207 140;
--pistachio-dream-oklch: oklch(0.808 0.101 134.3);
}
.element {
color: var(--pistachio-dream);
background-color: hsl(98 41% 68%);
border-color: oklch(0.808 0.101 134.3);
}Tailwind CSS v4
@theme {
--color-pistachio-dream: #a5cf8c;
--color-pistachio-dream-50: #e8fce0;
--color-pistachio-dream-100: #d9f0cf;
--color-pistachio-dream-200: #c1dfb4;
--color-pistachio-dream-300: #a0c490;
--color-pistachio-dream-400: #85ac6e;
--color-pistachio-dream-500: #69954d;
--color-pistachio-dream-600: #597e42;
--color-pistachio-dream-700: #476535;
--color-pistachio-dream-800: #354a24;
--color-pistachio-dream-900: #243318;
--color-pistachio-dream-950: #131f08;
}SCSS
$pistachio-dream: #a5cf8c;
$pistachio-dream-rgb: 165, 207, 140;
$pistachio-dream-light: mix(#fff, $pistachio-dream, 20%);
$pistachio-dream-dark: mix(#000, $pistachio-dream, 20%);
.element {
color: $pistachio-dream;
box-shadow: 0 0 0 2px rgba($pistachio-dream, 0.35);
}