Pistachio Gelato

freshpastelwarm

Click any swatch to copy its hex.

See it in place

Design that earns its keep

A tiny landing page, painted entirely with this palette so you can judge it doing real work.

Get started

Fast

Ships static, loads instantly.

Honest

Every choice explained.

Drag to place · tap to copy

How the preview picks colors: the lightest swatch becomes the page background, the darkest becomes the text, and the most vivid becomes the button. Drag a chip onto any part of the mockup to override it — your arrangement is saved into this page's URL, so copying the link shares it.

Why it works

Pistachio and raspberry work for the same reason the flavors do: a mild, milky green against a sharp red-pink, complements with just enough sweetness in both to stay friendly. Panna and shell are two creams — one warm, one green-tinged — that let packaging layer light surfaces without flatness. Chocolate closes the case-counter lineup and doubles as a rich, legible text color.

Built around Pistachio.

Use this palette

Hex values
#93c572, #fdf3e3, #e7edd6, #c94f6d, #563423
CSS custom properties
:root {
  --color-pistachio: #93c572;
  --color-panna: #fdf3e3;
  --color-shell: #e7edd6;
  --color-raspberry: #c94f6d;
  --color-chocolate: #563423;
}
Tailwind v4 theme
@theme {
  --color-pistachio: #93c572;
  --color-panna: #fdf3e3;
  --color-shell: #e7edd6;
  --color-raspberry: #c94f6d;
  --color-chocolate: #563423;
}
JSON
{
  "name": "Pistachio Gelato",
  "colors": [
    {
      "hex": "#93c572",
      "role": "pistachio"
    },
    {
      "hex": "#fdf3e3",
      "role": "panna"
    },
    {
      "hex": "#e7edd6",
      "role": "shell"
    },
    {
      "hex": "#c94f6d",
      "role": "raspberry"
    },
    {
      "hex": "#563423",
      "role": "chocolate"
    }
  ]
}

Related palettes