Cinder Mint

freshminimalmoody

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

A dark-interface palette built the way good terminals are: onyx and cinder for layered dark surfaces, silver and paper for two grades of text, and a single luminous accent. Mint green is that accent, and against near-black it glows at high contrast while staying easier on the eyes than neon lime. The whole set passes readability in both directions, which is why it works equally as a dark UI theme or a screenshot-heavy social feed.

Built around Onyx.

Use this palette

Hex values
#35383c, #4b4f54, #b9bdc2, #46c299, #f2f3f2
CSS custom properties
:root {
  --color-onyx: #35383c;
  --color-cinder: #4b4f54;
  --color-silver: #b9bdc2;
  --color-mint: #46c299;
  --color-paper: #f2f3f2;
}
Tailwind v4 theme
@theme {
  --color-onyx: #35383c;
  --color-cinder: #4b4f54;
  --color-silver: #b9bdc2;
  --color-mint: #46c299;
  --color-paper: #f2f3f2;
}
JSON
{
  "name": "Cinder Mint",
  "colors": [
    {
      "hex": "#35383c",
      "role": "onyx"
    },
    {
      "hex": "#4b4f54",
      "role": "cinder"
    },
    {
      "hex": "#b9bdc2",
      "role": "silver"
    },
    {
      "hex": "#46c299",
      "role": "mint"
    },
    {
      "hex": "#f2f3f2",
      "role": "paper"
    }
  ]
}

Related palettes