Shibori Cloth

calmminimalearthy

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

Like fabric pulled from a dye vat, this palette is one pigment at different exposures: indigo at full depth, ultramarine after a shorter soak, mist where the resist held, cotton where the cloth stayed bound. Because everything shares the same blue-violet root, harmony is structural rather than stylistic. Midnight adds a text-safe near-black that still reads as dye instead of printer ink.

Built around Indigo.

Use this palette

Hex values
#4b0082, #45549e, #a9b4d8, #f6f7f4, #23204a
CSS custom properties
:root {
  --color-indigo: #4b0082;
  --color-ultramarine: #45549e;
  --color-mist: #a9b4d8;
  --color-cotton: #f6f7f4;
  --color-midnight: #23204a;
}
Tailwind v4 theme
@theme {
  --color-indigo: #4b0082;
  --color-ultramarine: #45549e;
  --color-mist: #a9b4d8;
  --color-cotton: #f6f7f4;
  --color-midnight: #23204a;
}
JSON
{
  "name": "Shibori Cloth",
  "colors": [
    {
      "hex": "#4b0082",
      "role": "indigo"
    },
    {
      "hex": "#45549e",
      "role": "ultramarine"
    },
    {
      "hex": "#a9b4d8",
      "role": "mist"
    },
    {
      "hex": "#f6f7f4",
      "role": "cotton"
    },
    {
      "hex": "#23204a",
      "role": "midnight"
    }
  ]
}

Related palettes