Royal Decree to Amorous color palette

3E3542Royal Decree DBD5B7Banana Frappé 3A5E54Iridescent 9E997AA Frond in Need 8D8095Amorous

About this palette

Royal Decree to Amorous is a 5-color muted palette: #3E3542 (Royal Decree), #DBD5B7 (Banana Frappé), #3A5E54 (Iridescent), #9E997A (A Frond in Need), #8D8095 (Amorous). It mixes gray, yellow, turquoise tones and feels warm overall. The strongest text pairing is #3E3542 on #DBD5B7 with a contrast ratio of 7.93:1, and 2 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Royal Decree	rgb(62, 53, 66)	hsl(282, 11%, 23%)
Banana Frappé	rgb(219, 213, 183)	hsl(50, 33%, 79%)
Iridescent	rgb(58, 94, 84)	hsl(163, 24%, 30%)
A Frond in Need	rgb(158, 153, 122)	hsl(52, 16%, 55%)
Amorous	rgb(141, 128, 149)	hsl(277, 9%, 54%)

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.93:1 Very good#3E3542 on #DBD5B7
Aa7.93:1 Very good#DBD5B7 on #3E3542
Aa4.89:1 Good#DBD5B7 on #3A5E54
Aa4.89:1 Good#3A5E54 on #DBD5B7
Aa4.07:1 Poor#3E3542 on #9E997A
Aa4.07:1 Poor#9E997A on #3E3542
Aa3.15:1 Poor#3E3542 on #8D8095
Aa3.15:1 Poor#8D8095 on #3E3542

Color blindness preview

CSS variables

/* Royal Decree to Amorous — https://swatchly.xyz/palette/3e3542-dbd5b7-3a5e54-9e997a-8d8095 */
:root {
  --royal-decree: #3e3542;
  --banana-frapp: #dbd5b7;
  --iridescent: #3a5e54;
  --a-frond-in-need: #9e997a;
  --amorous: #8d8095;
}

Tailwind CSS v4

/* Royal Decree to Amorous — https://swatchly.xyz/palette/3e3542-dbd5b7-3a5e54-9e997a-8d8095 */
@theme {
  --color-royal-decree: #3e3542;
  --color-royal-decree-50: #f9f2fc;
  --color-royal-decree-100: #efe8f2;
  --color-royal-decree-200: #dcd4e0;
  --color-royal-decree-300: #c6bdcb;
  --color-royal-decree-400: #a99ead;
  --color-royal-decree-500: #8f8493;
  --color-royal-decree-600: #756b79;
  --color-royal-decree-700: #5f5663;
  --color-royal-decree-800: #4c4450;
  --color-royal-decree-900: #3e3542;
  --color-royal-decree-950: #272229;
  --color-banana-frapp: #dbd5b7;
  --color-banana-frapp-50: #f7f3e2;
  --color-banana-frapp-100: #ede9d6;
  --color-banana-frapp-200: #dbd5b7;
  --color-banana-frapp-300: #c4bfa5;
  --color-banana-frapp-400: #a6a085;
  --color-banana-frapp-500: #8b8569;
  --color-banana-frapp-600: #716b51;
  --color-banana-frapp-700: #5a553d;
  --color-banana-frapp-800: #47432e;
  --color-banana-frapp-900: #373321;
  --color-banana-frapp-950: #221f13;
  --color-iridescent: #3a5e54;
  --color-iridescent-50: #e5fbf4;
  --color-iridescent-100: #d9f2ea;
  --color-iridescent-200: #c2dfd6;
  --color-iridescent-300: #a8cabf;
  --color-iridescent-400: #86aba0;
  --color-iridescent-500: #6a9085;
  --color-iridescent-600: #51756a;
  --color-iridescent-700: #3a5e54;
  --color-iridescent-800: #2c4941;
  --color-iridescent-900: #203932;
  --color-iridescent-950: #12231f;
  --color-a-frond-in-need: #9e997a;
  --color-a-frond-in-need-50: #f5f2df;
  --color-a-frond-in-need-100: #eae7d1;
  --color-a-frond-in-need-200: #d6d2b8;
  --color-a-frond-in-need-300: #beba9d;
  --color-a-frond-in-need-400: #9e997a;
  --color-a-frond-in-need-500: #847f61;
  --color-a-frond-in-need-600: #6b674a;
  --color-a-frond-in-need-700: #565238;
  --color-a-frond-in-need-800: #44402a;
  --color-a-frond-in-need-900: #35321f;
  --color-a-frond-in-need-950: #222011;
  --color-amorous: #8d8095;
  --color-amorous-50: #f9f2fe;
  --color-amorous-100: #f0e7f6;
  --color-amorous-200: #ddd3e4;
  --color-amorous-300: #c7bbcf;
  --color-amorous-400: #a89bb0;
  --color-amorous-500: #8d8095;
  --color-amorous-600: #72667a;
  --color-amorous-700: #5b5062;
  --color-amorous-800: #483e4d;
  --color-amorous-900: #372f3c;
  --color-amorous-950: #221d26;
}