Muesli to Larb Gai Color Palette

About this palette

Muesli to Larb Gai is a 5-color muted, warm, earthy, vintage, monochromatic palette: #9A7F57 (Muesli), #BEA68B (Pergament), #56442A (Peat Brown), #312208 (Close but No Cigar), #DBC5AB (Larb Gai). It mixes yellow, orange, brown tones and feels warm overall. The strongest text pairing is #312208 on #DBC5AB with a contrast ratio of 9.24:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Muesli	rgb(154, 127, 87)	hsl(36, 28%, 47%)
Pergament	rgb(190, 166, 139)	hsl(32, 28%, 65%)
Peat Brown	rgb(86, 68, 42)	hsl(35, 34%, 25%)
Close but No Cigar	rgb(49, 34, 8)	hsl(38, 72%, 11%)
Larb Gai	rgb(219, 197, 171)	hsl(33, 40%, 76%)

Accessible color pairs

Pairs with at least 3:1 contrast (large text and UI components); 4.5:1 or more passes WCAG AA for body text.

Aa9.24:1 Very good#312208 on #DBC5AB
Aa9.24:1 Very good#DBC5AB on #312208
Aa6.62:1 Good#BEA68B on #312208
Aa6.62:1 Good#312208 on #BEA68B
Aa5.58:1 Good#56442A on #DBC5AB
Aa5.58:1 Good#DBC5AB on #56442A
Aa4.07:1 Poor#9A7F57 on #312208
Aa4.07:1 Poor#312208 on #9A7F57

Color blindness preview

CSS variables

/* Muesli to Larb Gai — https://swatchly.xyz/palette/9a7f57-bea68b-56442a-312208-dbc5ab */
:root {
  --muesli: #9a7f57;
  --pergament: #bea68b;
  --peat-brown: #56442a;
  --close-but-no-cigar: #312208;
  --larb-gai: #dbc5ab;
}

Tailwind CSS v4

/* Muesli to Larb Gai — https://swatchly.xyz/palette/9a7f57-bea68b-56442a-312208-dbc5ab */
@theme {
  --color-muesli: #9a7f57;
  --color-muesli-50: #fff3e2;
  --color-muesli-100: #fae7cd;
  --color-muesli-200: #e9d3b3;
  --color-muesli-300: #d4bb97;
  --color-muesli-400: #b69b74;
  --color-muesli-500: #9a7f57;
  --color-muesli-600: #7f653f;
  --color-muesli-700: #664f2c;
  --color-muesli-800: #513d1e;
  --color-muesli-900: #402f14;
  --color-muesli-950: #291c09;
  --color-pergament: #bea68b;
  --color-pergament-50: #fff7ee;
  --color-pergament-100: #fceddd;
  --color-pergament-200: #ecdbc7;
  --color-pergament-300: #d9c5ae;
  --color-pergament-400: #bea68b;
  --color-pergament-500: #a0896f;
  --color-pergament-600: #836d54;
  --color-pergament-700: #69553e;
  --color-pergament-800: #53412d;
  --color-pergament-900: #403120;
  --color-pergament-950: #271d11;
  --color-peat-brown: #56442a;
  --color-peat-brown-50: #fff3e3;
  --color-peat-brown-100: #f7e9d6;
  --color-peat-brown-200: #e5d5bf;
  --color-peat-brown-300: #d1bfa6;
  --color-peat-brown-400: #b4a085;
  --color-peat-brown-500: #9a866a;
  --color-peat-brown-600: #7f6c51;
  --color-peat-brown-700: #68563e;
  --color-peat-brown-800: #56442a;
  --color-peat-brown-900: #423421;
  --color-peat-brown-950: #2a2013;
  --color-close-but-no-cigar: #312208;
  --color-close-but-no-cigar-50: #fff4e3;
  --color-close-but-no-cigar-100: #f6e9d7;
  --color-close-but-no-cigar-200: #e4d5bf;
  --color-close-but-no-cigar-300: #cfbea6;
  --color-close-but-no-cigar-400: #b19f83;
  --color-close-but-no-cigar-500: #978469;
  --color-close-but-no-cigar-600: #7d6b51;
  --color-close-but-no-cigar-700: #66563d;
  --color-close-but-no-cigar-800: #52442e;
  --color-close-but-no-cigar-900: #423623;
  --color-close-but-no-cigar-950: #312208;
  --color-larb-gai: #dbc5ab;
  --color-larb-gai-50: #fff8f0;
  --color-larb-gai-100: #fceedf;
  --color-larb-gai-200: #ebdcc9;
  --color-larb-gai-300: #dbc5ab;
  --color-larb-gai-400: #b8a48d;
  --color-larb-gai-500: #9c876f;
  --color-larb-gai-600: #7f6c54;
  --color-larb-gai-700: #66543f;
  --color-larb-gai-800: #50402e;
  --color-larb-gai-900: #3d3021;
  --color-larb-gai-950: #271d12;
}