#A68A64Hazelnut
#C2B280Sand
#E6DCC3Bone
#FAF7F0Smoke

Oat Milk color palette

MutedWarmEarthyBrownBeigeWhite
Open in generator
Ask AI about this palette: ChatGPTClaudePerplexity

Oat Milk is a pastel light, monochromatic color palette tagged muted, warm, earthy. All four colors sit within 10° of hue, so the scheme reads as one color explored across light and dark. The colors are light and airy, which suits friendly, soft-spoken brands. The overall temperature is warm.

Color codes click any value to copy

SwatchNameHEXRGBHSLOKLCH
Hazelnut#A68A64rgb(166, 138, 100)hsl(35, 27%, 52%)oklch(65.0% 0.063 75)
Sand#C2B280rgb(194, 178, 128)hsl(45, 35%, 63%)oklch(76.5% 0.069 92)
Bone#E6DCC3rgb(230, 220, 195)hsl(43, 41%, 83%)oklch(89.6% 0.035 89)
Smoke#FAF7F0rgb(250, 247, 240)hsl(42, 50%, 96%)oklch(97.7% 0.010 87)

Why it works and how to use it

The palette holds together thanks to its monochromatic hue relationship and a soft light-to-dark ladder (96% down to 52% lightness). A natural fit for wellness, organic and outdoor brands.

  • Background: Smoke (#FAF7F0) is the lightest color, so it belongs on large surfaces.
  • Text: Hazelnut (#A68A64) on #FAF7F0 gives 3.05:1, enough for large headings only.
  • Primary: Bone (#E6DCC3) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
  • Accent: Sand (#C2B280) for highlights, badges and hover states.

No pair inside the palette reaches 4.5:1, so add black or white for body text.

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

BrandFeaturesPricingBlogGet started

Design faster with Oat Milk

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

#A68A64
#C2B280
#E6DCC3
#FAF7F0

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

Contrast check WCAG ratios between palette colors

PairSampleRatioLevel
#A68A64 on #FAF7F0Aa3.05:1AA large only
#A68A64 on #E6DCC3Aa2.39:1Fail
#C2B280 on #FAF7F0Aa1.97:1Fail
#A68A64 on #C2B280Aa1.55:1Fail
#C2B280 on #E6DCC3Aa1.54:1Fail
#E6DCC3 on #FAF7F0Aa1.28:1Fail

Similar palettes 24 more in this mood

More muted palettes →More warm palettes →More earthy palettes →More brown palettes →More beige palettes →More white palettes →