paletta
PALETTE GALLERY

Monochrome color palette

A monochrome palette drops hue and chroma entirely and works in lightness alone. This set is six true-neutral steps from Ink to Cloud, spaced so each adjacent pair stays visually distinct while the endpoints span a full 18.5:1 contrast ratio.

Updated 2026-07-15

  • InkText
    #0A0A0A
  • GraphitePrimary
    #2E2E2E
  • Slate GrayAccent
    #5C5C5C
  • StoneHighlight
    #8C8C8C
  • SilverSurface
    #C4C4C4
  • CloudBackground
    #F7F7F7

Where this palette works

Content-first and editorial interfaces

No hue competes with the content, useful for reading-heavy products like documentation or long-form publishing.

Photography and portfolio sites

A neutral chrome lets photography and imagery supply all the color on the page.

Print-adjacent and typography-led brands

Monochrome UI reads closer to print design conventions than a colored interface does.

Accessible pairings

Every step in this scale pairs with Cloud or Ink at a known ratio, so picking a text or border color is a lightness decision, not a hue decision. Ink on Cloud is the maximum-contrast pairing; Slate Gray on Cloud is the minimum usable pairing that still clears AA.

Aa
Ink on cloud
Contrast 18.48 : 1AAA
Aa
Graphite on cloud
Contrast 12.68 : 1AAA
Aa
Slate gray on cloud
Contrast 6.24 : 1AA
EXPORT

Use these tokens

Copy as CSS custom properties or a Tailwind v4 @theme block.

:root {
  --palette-text: #0A0A0A; /* Ink */
  --palette-primary: #2E2E2E; /* Graphite */
  --palette-accent: #5C5C5C; /* Slate Gray */
  --palette-highlight: #8C8C8C; /* Stone */
  --palette-surface: #C4C4C4; /* Silver */
  --palette-background: #F7F7F7; /* Cloud */
}

Frequently asked questions

Related palettes

Neutral minimalist palette

A neutral minimalist color palette built from charcoal, taupe, and warm gray, with hex codes, accessible text pairings, and export-ready CSS variables.

Dark mode palette

A dark mode color palette with layered void, elevated, and card surfaces, electric blue and signal accents, hex codes, and accessible pairings.

Earth tone palette

An earth tone color palette built from umber, terracotta, and olive, with hex codes, accessible text pairings, and export-ready CSS variables.

Build on this palette

Generate a full shade scale and export to Tailwind, shadcn, or Figma Variables.

Generate a palette