#0A0A0AObsidian
#3A3A3AOnyx
#E9E3D5Almond
#FFFFFFWhite

Black & Bone color palette

DarkMonochromeMinimalBlackGrayWhite
Open in generator
Ask AI about this palette: ChatGPTClaudePerplexity

Black & Bone is a muted neutral-based color palette tagged dark, monochrome, minimal. Almond is the only saturated color here, so it does all the talking against a neutral base. Every color is softened, so it works well as a background system for text-heavy layouts.

Color codes click any value to copy

SwatchNameHEXRGBHSLOKLCH
Obsidian#0A0A0Argb(10, 10, 10)hsl(0, 0%, 4%)oklch(14.5% 0.000 0)
Onyx#3A3A3Argb(58, 58, 58)hsl(0, 0%, 23%)oklch(34.8% 0.000 0)
Almond#E9E3D5rgb(233, 227, 213)hsl(42, 31%, 87%)oklch(91.7% 0.020 88)
White#FFFFFFrgb(255, 255, 255)hsl(0, 0%, 100%)oklch(100.0% 0.000 0)

Why it works and how to use it

Two of the four colors are near-neutral, which leaves room for Almond to lead. Lightness runs from 4% to 100%. Well suited to websites, presentations and branding.

  • Background: White (#FFFFFF) is the lightest color, so it belongs on large surfaces.
  • Text: Obsidian (#0A0A0A) on #FFFFFF gives 19.8:1, passing WCAG AAA.
  • Primary: Almond (#E9E3D5) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
  • Accent: Onyx (#3A3A3A) for highlights, badges and hover states.

4 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Obsidian on White at 19.8:1.

Preview on a real UI see how the palette feels in context

BrandFeaturesPricingBlogGet started

Design faster with Black & Bone

A palette preview that turns four colors into a page, so you can judge hierarchy, contrast and mood before you commit.

Primary action Secondary
Card title
Card title
Card title
Roles are assigned by lightness.

Color blindness simulation

#0A0A0A
#3A3A3A
#E9E3D5
#FFFFFF

Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.

Contrast check WCAG ratios between palette colors

PairSampleRatioLevel
#0A0A0A on #FFFFFFAa19.8:1AAA
#0A0A0A on #E9E3D5Aa15.47:1AAA
#3A3A3A on #FFFFFFAa11.37:1AAA
#3A3A3A on #E9E3D5Aa8.89:1AAA
#0A0A0A on #3A3A3AAa1.74:1Fail
#E9E3D5 on #FFFFFFAa1.28:1Fail

Similar palettes 24 more in this mood

More dark palettes →More monochrome palettes →More minimal palettes →More black palettes →More gray palettes →More white palettes →