Lime Voltage

vibrant

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

Lime and magenta are both at maximum saturation and near-opposite hues, a deliberately electric clash borrowed from club flyers and esports graphics. The trick that keeps it usable is the ruthless neutrality of everything else: black, off-white and steel gray contain the two neons so they collide only where you want attention. On a black ground the lime hits close to its full luminous potential.

Built around Lime Green.

Use this palette

Hex values
#32cd32, #101014, #f5f5f0, #e0369e, #55565c
CSS custom properties
:root {
  --color-lime: #32cd32;
  --color-black: #101014;
  --color-static: #f5f5f0;
  --color-magenta: #e0369e;
  --color-steel: #55565c;
}
Tailwind v4 theme
@theme {
  --color-lime: #32cd32;
  --color-black: #101014;
  --color-static: #f5f5f0;
  --color-magenta: #e0369e;
  --color-steel: #55565c;
}
JSON
{
  "name": "Lime Voltage",
  "colors": [
    {
      "hex": "#32cd32",
      "role": "lime"
    },
    {
      "hex": "#101014",
      "role": "black"
    },
    {
      "hex": "#f5f5f0",
      "role": "static"
    },
    {
      "hex": "#e0369e",
      "role": "magenta"
    },
    {
      "hex": "#55565c",
      "role": "steel"
    }
  ]
}

Related palettes