Asparagus Sultan to Midnight Dreams color palette

638F34Asparagus Sultan 593481Kingfisher Daisy E69B7ELes Demoiselles d’Avignon C2ECFFIcy Breeze 012026Midnight Dreams

Open in generator Export PNG, PDF, ASE…

About this palette

Asparagus Sultan to Midnight Dreams is a 5-color cool palette: #638F34 (Asparagus Sultan), #593481 (Kingfisher Daisy), #E69B7E (Les Demoiselles d’Avignon), #C2ECFF (Icy Breeze), #012026 (Midnight Dreams). It mixes green, purple, orange, blue, turquoise tones and feels cool overall. The strongest text pairing is #C2ECFF on #012026 with a contrast ratio of 13.54:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Asparagus Sultan	rgb(99, 143, 52)	hsl(89, 47%, 38%)
Kingfisher Daisy	rgb(89, 52, 129)	hsl(269, 43%, 35%)
Les Demoiselles d’Avignon	rgb(230, 155, 126)	hsl(17, 68%, 70%)
Icy Breeze	rgb(194, 236, 255)	hsl(199, 100%, 88%)
Midnight Dreams	rgb(1, 32, 38)	hsl(190, 95%, 8%)

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.

Aa13.54:1 Super#C2ECFF on #012026
Aa13.54:1 Super#012026 on #C2ECFF
Aa7.57:1 Very good#E69B7E on #012026
Aa7.57:1 Very good#012026 on #E69B7E
Aa7.49:1 Very good#593481 on #C2ECFF
Aa7.49:1 Very good#C2ECFF on #593481
Aa4.46:1 Poor#638F34 on #012026
Aa4.46:1 Poor#012026 on #638F34

Color blindness preview

CSS variables

/* Asparagus Sultan to Midnight Dreams — https://swatchly.xyz/palette/638f34-593481-e69b7e-c2ecff-012026 */
:root {
  --asparagus-sultan: #638f34;
  --kingfisher-daisy: #593481;
  --les-demoiselles-d-avignon: #e69b7e;
  --icy-breeze: #c2ecff;
  --midnight-dreams: #012026;
}

Tailwind CSS v4

/* Asparagus Sultan to Midnight Dreams — https://swatchly.xyz/palette/638f34-593481-e69b7e-c2ecff-012026 */
@theme {
  --color-asparagus-sultan: #638f34;
  --color-asparagus-sultan-50: #e3ffcc;
  --color-asparagus-sultan-100: #d5f5bb;
  --color-asparagus-sultan-200: #bde29d;
  --color-asparagus-sultan-300: #a2cc7d;
  --color-asparagus-sultan-400: #7fac54;
  --color-asparagus-sultan-500: #638f34;
  --color-asparagus-sultan-600: #4b7519;
  --color-asparagus-sultan-700: #395e01;
  --color-asparagus-sultan-800: #2b4a00;
  --color-asparagus-sultan-900: #203900;
  --color-asparagus-sultan-950: #132400;
  --color-kingfisher-daisy: #593481;
  --color-kingfisher-daisy-50: #f7f3ff;
  --color-kingfisher-daisy-100: #f0e6ff;
  --color-kingfisher-daisy-200: #e1cdff;
  --color-kingfisher-daisy-300: #d1b1fc;
  --color-kingfisher-daisy-400: #b491e2;
  --color-kingfisher-daisy-500: #9b76c9;
  --color-kingfisher-daisy-600: #815dad;
  --color-kingfisher-daisy-700: #6a4892;
  --color-kingfisher-daisy-800: #593481;
  --color-kingfisher-daisy-900: #442962;
  --color-kingfisher-daisy-950: #2c1842;
  --color-les-demoiselles-d-avignon: #e69b7e;
  --color-les-demoiselles-d-avignon-50: #fff9f6;
  --color-les-demoiselles-d-avignon-100: #ffefe9;
  --color-les-demoiselles-d-avignon-200: #ffd8c9;
  --color-les-demoiselles-d-avignon-300: #fbbda5;
  --color-les-demoiselles-d-avignon-400: #e69b7e;
  --color-les-demoiselles-d-avignon-500: #c57d61;
  --color-les-demoiselles-d-avignon-600: #a56045;
  --color-les-demoiselles-d-avignon-700: #87482f;
  --color-les-demoiselles-d-avignon-800: #6c351f;
  --color-les-demoiselles-d-avignon-900: #542613;
  --color-les-demoiselles-d-avignon-950: #351507;
  --color-icy-breeze: #c2ecff;
  --color-icy-breeze-50: #dcf4ff;
  --color-icy-breeze-100: #c2ecff;
  --color-icy-breeze-200: #b8d8e6;
  --color-icy-breeze-300: #a0c3d3;
  --color-icy-breeze-400: #7ea5b6;
  --color-icy-breeze-500: #648b9c;
  --color-icy-breeze-600: #4b7181;
  --color-icy-breeze-700: #385b6a;
  --color-icy-breeze-800: #294754;
  --color-icy-breeze-900: #1d3742;
  --color-icy-breeze-950: #0f222a;
  --color-midnight-dreams: #012026;
  --color-midnight-dreams-50: #e6f9fe;
  --color-midnight-dreams-100: #daf0f5;
  --color-midnight-dreams-200: #c3dde3;
  --color-midnight-dreams-300: #aac7cd;
  --color-midnight-dreams-400: #88a8af;
  --color-midnight-dreams-500: #6b8c93;
  --color-midnight-dreams-600: #517077;
  --color-midnight-dreams-700: #3c585f;
  --color-midnight-dreams-800: #2c4449;
  --color-midnight-dreams-900: #1f3338;
  --color-midnight-dreams-950: #012026;
}