Monochrome Palette

CSS variables

:root {
  --color-1: #212529;
  --color-2: #495057;
  --color-3: #ADB5BD;
  --color-4: #DEE2E6;
  --color-5: #F8F9FA;
}

Tailwind config

// tailwind.config.js
colors: {
  "monochrome-1": "#212529",
  "monochrome-2": "#495057",
  "monochrome-3": "#ADB5BD",
  "monochrome-4": "#DEE2E6",
  "monochrome-5": "#F8F9FA",
}

About this palette

The Monochrome palette is a curated set of 5 colors with their HEX, RGB and ready CSS-variable and Tailwind exports. Click any swatch for that color's full breakdown — conversions, contrast and harmonies.

More palettes