Aztec to Sleepless Blue color palette

2B372CAztec 63452DIrish Coffee 76657ARum B99169Caramel Gold 9AC1A3Lichen B5D9EESleepless Blue

About this palette

Aztec to Sleepless Blue is a 6-color muted palette: #2B372C (Aztec), #63452D (Irish Coffee), #76657A (Rum), #B99169 (Caramel Gold), #9AC1A3 (Lichen), #B5D9EE (Sleepless Blue). It mixes gray, brown, purple, orange, green, blue tones and feels cool overall. The strongest text pairing is #2B372C on #B5D9EE with a contrast ratio of 8.38:1, and 3 of its 15 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Aztec	rgb(43, 55, 44)	hsl(125, 12%, 19%)
Irish Coffee	rgb(99, 69, 45)	hsl(27, 38%, 28%)
Rum	rgb(118, 101, 122)	hsl(289, 9%, 44%)
Caramel Gold	rgb(185, 145, 105)	hsl(30, 36%, 57%)
Lichen	rgb(154, 193, 163)	hsl(134, 24%, 68%)
Sleepless Blue	rgb(181, 217, 238)	hsl(202, 63%, 82%)

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.

Aa8.38:1 Very good#2B372C on #B5D9EE
Aa8.38:1 Very good#B5D9EE on #2B372C
Aa6.25:1 Good#2B372C on #9AC1A3
Aa6.25:1 Good#9AC1A3 on #2B372C
Aa5.84:1 Good#63452D on #B5D9EE
Aa5.84:1 Good#B5D9EE on #63452D
Aa4.35:1 Poor#63452D on #9AC1A3
Aa4.35:1 Poor#9AC1A3 on #63452D

Color blindness preview

CSS variables

/* Aztec to Sleepless Blue — https://swatchly.xyz/palette/2b372c-63452d-76657a-b99169-9ac1a3-b5d9ee */
:root {
  --aztec: #2b372c;
  --irish-coffee: #63452d;
  --rum: #76657a;
  --caramel-gold: #b99169;
  --lichen: #9ac1a3;
  --sleepless-blue: #b5d9ee;
}

Tailwind CSS v4

/* Aztec to Sleepless Blue — https://swatchly.xyz/palette/2b372c-63452d-76657a-b99169-9ac1a3-b5d9ee */
@theme {
  --color-aztec: #2b372c;
  --color-aztec-50: #eff8f0;
  --color-aztec-100: #e5eee5;
  --color-aztec-200: #d0dbd1;
  --color-aztec-300: #b8c5b9;
  --color-aztec-400: #98a699;
  --color-aztec-500: #7d8b7e;
  --color-aztec-600: #637064;
  --color-aztec-700: #4d594e;
  --color-aztec-800: #3c463c;
  --color-aztec-900: #2b372c;
  --color-aztec-950: #1b221c;
  --color-irish-coffee: #63452d;
  --color-irish-coffee-50: #fff3e9;
  --color-irish-coffee-100: #fde6d5;
  --color-irish-coffee-200: #ebd0bb;
  --color-irish-coffee-300: #d6b79f;
  --color-irish-coffee-400: #b6957c;
  --color-irish-coffee-500: #99785f;
  --color-irish-coffee-600: #7b5d45;
  --color-irish-coffee-700: #63452d;
  --color-irish-coffee-800: #4d3623;
  --color-irish-coffee-900: #3c2919;
  --color-irish-coffee-950: #26180d;
  --color-rum: #76657a;
  --color-rum-50: #fcf1fe;
  --color-rum-100: #f3e6f5;
  --color-rum-200: #e0d2e3;
  --color-rum-300: #cbbbce;
  --color-rum-400: #ac9bb0;
  --color-rum-500: #917f95;
  --color-rum-600: #76657a;
  --color-rum-700: #5e4f62;
  --color-rum-800: #4a3d4d;
  --color-rum-900: #392e3c;
  --color-rum-950: #241c26;
  --color-caramel-gold: #b99169;
  --color-caramel-gold-50: #ffefe0;
  --color-caramel-gold-100: #fde2c7;
  --color-caramel-gold-200: #eccbac;
  --color-caramel-gold-300: #d7b38f;
  --color-caramel-gold-400: #b99169;
  --color-caramel-gold-500: #9e7750;
  --color-caramel-gold-600: #835f39;
  --color-caramel-gold-700: #6b4a27;
  --color-caramel-gold-800: #56391a;
  --color-caramel-gold-900: #442c11;
  --color-caramel-gold-950: #2d1b08;
  --color-lichen: #9ac1a3;
  --color-lichen-50: #dff6e4;
  --color-lichen-100: #d1ebd6;
  --color-lichen-200: #b8d7bf;
  --color-lichen-300: #9ac1a3;
  --color-lichen-400: #7ea387;
  --color-lichen-500: #648a6e;
  --color-lichen-600: #4d7056;
  --color-lichen-700: #3b5b43;
  --color-lichen-800: #2c4834;
  --color-lichen-900: #213928;
  --color-lichen-950: #122417;
  --color-sleepless-blue: #b5d9ee;
  --color-sleepless-blue-50: #e4f5ff;
  --color-sleepless-blue-100: #d4ebf9;
  --color-sleepless-blue-200: #b5d9ee;
  --color-sleepless-blue-300: #a4c2d4;
  --color-sleepless-blue-400: #83a4b7;
  --color-sleepless-blue-500: #68899d;
  --color-sleepless-blue-600: #4f6f82;
  --color-sleepless-blue-700: #3c596a;
  --color-sleepless-blue-800: #2c4655;
  --color-sleepless-blue-900: #203642;
  --color-sleepless-blue-950: #12212a;
}