Poolside Soda

vibrantretrofresh

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

Aqua, lemon and raspberry are a 1950s soda-fountain triad — three brights spaced widely around the wheel so each keeps its own identity. Cream stands in for white and gives the palette its vintage, sun-faded backdrop, while deep ink teal keeps text inside the aqua family instead of defaulting to black. Use aqua as the lead and ration the raspberry: it is the loudest voice in the room.

Built around Aqua.

Use this palette

Hex values
#00c2c7, #fff9ec, #ffd23f, #ff5d8f, #073b4c
CSS custom properties
:root {
  --color-aqua: #00c2c7;
  --color-cream: #fff9ec;
  --color-lemon: #ffd23f;
  --color-raspberry: #ff5d8f;
  --color-ink: #073b4c;
}
Tailwind v4 theme
@theme {
  --color-aqua: #00c2c7;
  --color-cream: #fff9ec;
  --color-lemon: #ffd23f;
  --color-raspberry: #ff5d8f;
  --color-ink: #073b4c;
}
JSON
{
  "name": "Poolside Soda",
  "colors": [
    {
      "hex": "#00c2c7",
      "role": "aqua"
    },
    {
      "hex": "#fff9ec",
      "role": "cream"
    },
    {
      "hex": "#ffd23f",
      "role": "lemon"
    },
    {
      "hex": "#ff5d8f",
      "role": "raspberry"
    },
    {
      "hex": "#073b4c",
      "role": "ink"
    }
  ]
}

Related palettes