Pistachio Color Palette

The hex code #93C572 is three pairs of base-16 numbers for red, green and blue. 93 is 147, C5 is 197 and 72 is 114, each on a scale from 0 to 255. That is why the same color is written rgb(147, 197, 114) in CSS. The green channel is the strongest here, which is what gives pistachio its yellow-green character.

HSL describes the same color the way people think about it. A hue of 96 degrees places pistachio in the yellow-green part of the color wheel. Saturation of 42% makes it moderately saturated, and lightness of 61% makes it a light color. HSL is the easiest format to adjust by hand: keep the hue, then raise or lower lightness to create tints and shades that stay in the same family.

For print, the approximate CMYK mix is 25% cyan, 0% magenta, 42% yellow and 23% black. Screen and print colors never match perfectly, because monitors emit light while ink absorbs it, so always proof a printed sample before committing to pistachio for packaging or stationery. See MDN's guide to CSS color values for every format browsers accept.

A full 50 to 950 scale built around #93C572, so you can use pistachio for backgrounds, borders, buttons and text without leaving the family. Click any shade to copy it.

The 50 to 950 scale above follows the same structure as Tailwind's built-in palettes, so each step has a natural job. The lightest steps, 50 (#E6F2DE) and 100 (#D1E6C3), are page and card backgrounds: they carry the pistachio mood without competing with content. Steps 200 (#BCDBA8) and 300 (#A8D08D) suit borders, dividers, hover states and selected rows.

The middle of the scale, 400 to 600, is where pistachio is most recognizable, so use it for brand moments, illustrations and primary buttons. White text reaches the 4.5:1 body-text contrast minimum from step 800 upward, so use step 800 or darker when a button label needs to be white. Near-black text stays readable on steps 50 to 600.

The darkest steps, 800 (#4D693B) through 950 (#2A3B1F), make headings, body text and dark-mode surfaces that stay clearly related to pistachio. Using step 900 or 950 for text instead of pure black is one of the simplest ways to make an interface feel designed rather than default.

Complementary. Directly across the color wheel from pistachio is #A472C5, which sits closest to lilac among common named colors. Complementary pairs create the strongest contrast of hue, so use the second color sparingly, for a single call to action or highlight, rather than in equal amounts.

Analogous. #BDC572 and #72C57B sit 30 degrees either side of pistachio. Analogous palettes feel calm and cohesive because the colors share undertones; they are ideal for illustrations, gradients and backgrounds where you want harmony more than contrast.

Triadic and split complementary. The triadic set (#7293C5 and #C57293) is evenly spaced around the wheel and feels playful; the second color is closest to steel blue. The split complementary set (#7B72C5 and #C572BC) keeps much of the complementary contrast but is easier to balance, which makes it a good choice for data visualization and multi-category tags.

Monochromatic. The monochromatic set runs from #E6F2DE to #4D7731. A single-hue palette is the safest way to build a calm, premium interface: rely on lightness for hierarchy, then add one neutral and one accent if you need emphasis.

sage green (#9CAF88) is about as light and more muted, and leans back the wheel toward yellow-green. Choose sage green if you need more weight and contrast; choose pistachio if you want its specific balance of brightness and color.

moss green (#8A9A5B) is darker (48% vs 61% lightness) and more muted, and leans back the wheel toward yellow-green. Choose moss green if you need more weight and contrast; choose pistachio if you want its specific balance of brightness and color.

sand (#C2B280) is about as light and more muted, and leans back the wheel toward yellow-orange. Choose sand if you want a softer, airier version; choose pistachio if you want its specific balance of brightness and color.

Swatches only tell half the story. Here pistachio carries the primary action, with tints from its own scale for the surface and panels.

Green reads as growth, health, money and calm. Muted greens feel natural and organic; saturated greens feel fresh and energetic.

Pistachio is named after the pale green kernel of the pistachio nut. It is closely associated with gelato and pastry, and it has become a popular soft accent color in fashion and interiors.

In interfaces green is already wired to mean success and confirmation, so if you use it as a brand color, pick a different hue (or a much darker shade) for success states so the two never get confused.

Pistachio pairs with blush pink, cream, chocolate brown and soft lavender. It is light, so pair it with dark text. Use it for playful highlights, product backgrounds and food photography backdrops.