Couch to Stardust Evening color palette

4C2B1DCouch 504F79Tangent Periwinkle 407E62Amazon AF744ENot yet Caramel 7DAD93Catnip BFC2E2Stardust Evening

Open in generator Export PNG, PDF, ASE…

About this palette

Couch to Stardust Evening is a 6-color cool, earthy palette: #4C2B1D (Couch), #504F79 (Tangent Periwinkle), #407E62 (Amazon), #AF744E (Not yet Caramel), #7DAD93 (Catnip), #BFC2E2 (Stardust Evening). It mixes brown, purple, green, orange tones and feels cool overall. The strongest text pairing is #4C2B1D on #BFC2E2 with a contrast ratio of 7.20:1, and 2 of its 15 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Couch	rgb(76, 43, 29)	hsl(18, 45%, 21%)
Tangent Periwinkle	rgb(80, 79, 121)	hsl(241, 21%, 39%)
Amazon	rgb(64, 126, 98)	hsl(153, 33%, 37%)
Not yet Caramel	rgb(175, 116, 78)	hsl(24, 38%, 50%)
Catnip	rgb(125, 173, 147)	hsl(147, 23%, 58%)
Stardust Evening	rgb(191, 194, 226)	hsl(235, 38%, 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.

Aa7.20:1 Very good#4C2B1D on #BFC2E2
Aa7.20:1 Very good#BFC2E2 on #4C2B1D
Aa4.95:1 Good#4C2B1D on #7DAD93
Aa4.95:1 Good#7DAD93 on #4C2B1D
Aa4.40:1 Poor#504F79 on #BFC2E2
Aa4.40:1 Poor#BFC2E2 on #504F79
Aa3.25:1 Poor#4C2B1D on #AF744E
Aa3.25:1 Poor#AF744E on #4C2B1D

Color blindness preview

CSS variables

/* Couch to Stardust Evening — https://swatchly.xyz/palette/4c2b1d-504f79-407e62-af744e-7dad93-bfc2e2 */
:root {
  --couch: #4c2b1d;
  --tangent-periwinkle: #504f79;
  --amazon: #407e62;
  --not-yet-caramel: #af744e;
  --catnip: #7dad93;
  --stardust-evening: #bfc2e2;
}

Tailwind CSS v4

/* Couch to Stardust Evening — https://swatchly.xyz/palette/4c2b1d-504f79-407e62-af744e-7dad93-bfc2e2 */
@theme {
  --color-couch: #4c2b1d;
  --color-couch-50: #fff2ed;
  --color-couch-100: #ffe5da;
  --color-couch-200: #f0d0c3;
  --color-couch-300: #dcb8a9;
  --color-couch-400: #bf9888;
  --color-couch-500: #a47d6d;
  --color-couch-600: #886354;
  --color-couch-700: #6f4e40;
  --color-couch-800: #593c30;
  --color-couch-900: #4c2b1d;
  --color-couch-950: #2e1c14;
  --color-tangent-periwinkle: #504f79;
  --color-tangent-periwinkle-50: #f4f4ff;
  --color-tangent-periwinkle-100: #e8e9ff;
  --color-tangent-periwinkle-200: #d3d3f8;
  --color-tangent-periwinkle-300: #bcbce6;
  --color-tangent-periwinkle-400: #9c9cc9;
  --color-tangent-periwinkle-500: #8080ae;
  --color-tangent-periwinkle-600: #666691;
  --color-tangent-periwinkle-700: #504f79;
  --color-tangent-periwinkle-800: #3e3d5f;
  --color-tangent-periwinkle-900: #2f2f4b;
  --color-tangent-periwinkle-950: #1d1c31;
  --color-amazon: #407e62;
  --color-amazon-50: #dcffed;
  --color-amazon-100: #d0f7e3;
  --color-amazon-200: #b7e5ce;
  --color-amazon-300: #9cd1b6;
  --color-amazon-400: #78b396;
  --color-amazon-500: #5b997b;
  --color-amazon-600: #407e62;
  --color-amazon-700: #2c654c;
  --color-amazon-800: #1c503a;
  --color-amazon-900: #113e2b;
  --color-amazon-950: #06271a;
  --color-not-yet-caramel: #af744e;
  --color-not-yet-caramel-50: #fff2ea;
  --color-not-yet-caramel-100: #ffe4d4;
  --color-not-yet-caramel-200: #fbcbad;
  --color-not-yet-caramel-300: #e8b290;
  --color-not-yet-caramel-400: #cb906b;
  --color-not-yet-caramel-500: #af744e;
  --color-not-yet-caramel-600: #925a36;
  --color-not-yet-caramel-700: #784523;
  --color-not-yet-caramel-800: #603516;
  --color-not-yet-caramel-900: #4c270d;
  --color-not-yet-caramel-950: #321705;
  --color-catnip: #7dad93;
  --color-catnip-50: #e1fded;
  --color-catnip-100: #d5f3e2;
  --color-catnip-200: #bce1cc;
  --color-catnip-300: #a2cbb4;
  --color-catnip-400: #7dad93;
  --color-catnip-500: #629178;
  --color-catnip-600: #49765f;
  --color-catnip-700: #355f4a;
  --color-catnip-800: #264b38;
  --color-catnip-900: #1b3a2a;
  --color-catnip-950: #0e2519;
  --color-stardust-evening: #bfc2e2;
  --color-stardust-evening-50: #f5f6ff;
  --color-stardust-evening-100: #eaecff;
  --color-stardust-evening-200: #d6d9f0;
  --color-stardust-evening-300: #bfc2e2;
  --color-stardust-evening-400: #9fa2bf;
  --color-stardust-evening-500: #8386a4;
  --color-stardust-evening-600: #696b87;
  --color-stardust-evening-700: #52546e;
  --color-stardust-evening-800: #3f4157;
  --color-stardust-evening-900: #303144;
  --color-stardust-evening-950: #1d1e2b;
}