Tidepool Morning

freshpastel

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

Seafoam and aqua are adjacent cool pastels that blend into a single watery field, exactly the ambiguity of looking into a tidepool. Coral is the starfish in that pool: a warm accent that is seafoam's near-complement, saturated a step above everything else so it pulls focus instantly. Ink, a blue-gray rather than black, keeps linework and captions in the same cool morning light.

Built around Seafoam.

Use this palette

Hex values
#9fe2bf, #c8ecec, #f6fbf8, #f08a70, #23323c
CSS custom properties
:root {
  --color-seafoam: #9fe2bf;
  --color-aqua: #c8ecec;
  --color-foam: #f6fbf8;
  --color-coral: #f08a70;
  --color-ink: #23323c;
}
Tailwind v4 theme
@theme {
  --color-seafoam: #9fe2bf;
  --color-aqua: #c8ecec;
  --color-foam: #f6fbf8;
  --color-coral: #f08a70;
  --color-ink: #23323c;
}
JSON
{
  "name": "Tidepool Morning",
  "colors": [
    {
      "hex": "#9fe2bf",
      "role": "seafoam"
    },
    {
      "hex": "#c8ecec",
      "role": "aqua"
    },
    {
      "hex": "#f6fbf8",
      "role": "foam"
    },
    {
      "hex": "#f08a70",
      "role": "coral"
    },
    {
      "hex": "#23323c",
      "role": "ink"
    }
  ]
}

Related palettes