Prom Corsage to Myrtle color palette

About this palette

Prom Corsage to Myrtle is a 6-color cool palette: #E0CAF2 (Prom Corsage), #A4C57D (Fiddle-Leaf Fig), #7CA762 (Ferntastic), #8A6DA0 (Crown Jewels), #6D5476 (Plummy), #284026 (Myrtle). It mixes purple, green tones and feels cool overall. The strongest text pairing is #E0CAF2 on #284026 with a contrast ratio of 7.51:1, and 2 of its 15 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Prom Corsagergb(224, 202, 242)hsl(273, 61%, 87%)
Fiddle-Leaf Figrgb(164, 197, 125)hsl(87, 38%, 63%)
Ferntasticrgb(124, 167, 98)hsl(97, 28%, 52%)
Crown Jewelsrgb(138, 109, 160)hsl(274, 21%, 53%)
Plummyrgb(109, 84, 118)hsl(284, 17%, 40%)
Myrtlergb(40, 64, 38)hsl(115, 25%, 20%)

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.51:1 Very good#E0CAF2 on #284026
  • Aa7.51:1 Very good#284026 on #E0CAF2
  • Aa5.87:1 Good#A4C57D on #284026
  • Aa5.87:1 Good#284026 on #A4C57D
  • Aa4.37:1 Poor#E0CAF2 on #6D5476
  • Aa4.37:1 Poor#6D5476 on #E0CAF2
  • Aa4.08:1 Poor#7CA762 on #284026
  • Aa4.08:1 Poor#284026 on #7CA762

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Prom Corsage to Myrtle — https://swatchly.xyz/palette/e0caf2-a4c57d-7ca762-8a6da0-6d5476-284026 */
:root {
  --prom-corsage: #e0caf2;
  --fiddle-leaf-fig: #a4c57d;
  --ferntastic: #7ca762;
  --crown-jewels: #8a6da0;
  --plummy: #6d5476;
  --myrtle: #284026;
}

Tailwind CSS v4

/* Prom Corsage to Myrtle — https://swatchly.xyz/palette/e0caf2-a4c57d-7ca762-8a6da0-6d5476-284026 */
@theme {
  --color-prom-corsage: #e0caf2;
  --color-prom-corsage-50: #f8efff;
  --color-prom-corsage-100: #f0e2fc;
  --color-prom-corsage-200: #e0caf2;
  --color-prom-corsage-300: #c8b6d8;
  --color-prom-corsage-400: #aa96bb;
  --color-prom-corsage-500: #8f7ba0;
  --color-prom-corsage-600: #756284;
  --color-prom-corsage-700: #5e4c6c;
  --color-prom-corsage-800: #4a3b56;
  --color-prom-corsage-900: #3a2d44;
  --color-prom-corsage-950: #241b2b;
  --color-fiddle-leaf-fig: #a4c57d;
  --color-fiddle-leaf-fig-50: #e4f9ce;
  --color-fiddle-leaf-fig-100: #d7eebe;
  --color-fiddle-leaf-fig-200: #c0dba2;
  --color-fiddle-leaf-fig-300: #a4c57d;
  --color-fiddle-leaf-fig-400: #87a662;
  --color-fiddle-leaf-fig-500: #6e8c47;
  --color-fiddle-leaf-fig-600: #56732f;
  --color-fiddle-leaf-fig-700: #435c1d;
  --color-fiddle-leaf-fig-800: #334910;
  --color-fiddle-leaf-fig-900: #273a08;
  --color-fiddle-leaf-fig-950: #172402;
  --color-ferntastic: #7ca762;
  --color-ferntastic-50: #e1fcd2;
  --color-ferntastic-100: #d3f1c3;
  --color-ferntastic-200: #badea7;
  --color-ferntastic-300: #9fc789;
  --color-ferntastic-400: #7ca762;
  --color-ferntastic-500: #638d49;
  --color-ferntastic-600: #4c7332;
  --color-ferntastic-700: #395c20;
  --color-ferntastic-800: #2b4914;
  --color-ferntastic-900: #1f3a0b;
  --color-ferntastic-950: #122504;
  --color-crown-jewels: #8a6da0;
  --color-crown-jewels-50: #f8efff;
  --color-crown-jewels-100: #f1dfff;
  --color-crown-jewels-200: #dec6f2;
  --color-crown-jewels-300: #c7acdd;
  --color-crown-jewels-400: #a78abe;
  --color-crown-jewels-500: #8a6da0;
  --color-crown-jewels-600: #715685;
  --color-crown-jewels-700: #5b426d;
  --color-crown-jewels-800: #483358;
  --color-crown-jewels-900: #392746;
  --color-crown-jewels-950: #24172e;
  --color-plummy: #6d5476;
  --color-plummy-50: #fbf1ff;
  --color-plummy-100: #f6e4fc;
  --color-plummy-200: #e6d1ed;
  --color-plummy-300: #d2bbdb;
  --color-plummy-400: #b69cbf;
  --color-plummy-500: #9c82a6;
  --color-plummy-600: #83698c;
  --color-plummy-700: #6d5476;
  --color-plummy-800: #56415d;
  --color-plummy-900: #433149;
  --color-plummy-950: #2b1e2f;
  --color-myrtle: #284026;
  --color-myrtle-50: #eafbe9;
  --color-myrtle-100: #dff1dd;
  --color-myrtle-200: #c9dfc7;
  --color-myrtle-300: #b1c9ae;
  --color-myrtle-400: #91ab8e;
  --color-myrtle-500: #769174;
  --color-myrtle-600: #5e775b;
  --color-myrtle-700: #496147;
  --color-myrtle-800: #394e37;
  --color-myrtle-900: #284026;
  --color-myrtle-950: #1b2819;
}

Similar palettes