Start generating

Cold Lips to Matt Purple color palette

9599FFCold Lips8CE5C4Sea Foam9D3013Spill the BeansC65200Dark Orange005B28O Tannenbaum8876ECMatt Purple
Open in generator Export PNG, PDF, ASE…

About this palette

Cold Lips to Matt Purple is a 6-color vibrant, cool palette: #9599FF (Cold Lips), #8CE5C4 (Sea Foam), #9D3013 (Spill the Beans), #C65200 (Dark Orange), #005B28 (O Tannenbaum), #8876EC (Matt Purple). It mixes purple, turquoise, red, orange, green tones and feels cool overall. The strongest text pairing is #8CE5C4 on #005B28 with a contrast ratio of 5.59:1, and 2 of its 15 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Cold Lipsrgb(149, 153, 255)hsl(238, 100%, 79%)
Sea Foamrgb(140, 229, 196)hsl(158, 63%, 72%)
Spill the Beansrgb(157, 48, 19)hsl(13, 78%, 35%)
Dark Orangergb(198, 82, 0)hsl(25, 100%, 39%)
O Tannenbaumrgb(0, 91, 40)hsl(146, 100%, 18%)
Matt Purplergb(136, 118, 236)hsl(249, 76%, 69%)

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.

  • Aa5.59:1 Good#8CE5C4 on #005B28
  • Aa5.59:1 Good#005B28 on #8CE5C4
  • Aa4.93:1 Good#8CE5C4 on #9D3013
  • Aa4.93:1 Good#9D3013 on #8CE5C4
  • Aa3.28:1 Poor#9599FF on #005B28
  • Aa3.28:1 Poor#005B28 on #9599FF
  • Aa3.06:1 Poor#8CE5C4 on #C65200
  • Aa3.06:1 Poor#C65200 on #8CE5C4

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Cold Lips to Matt Purple — https://swatchly.xyz/palette/9599ff-8ce5c4-9d3013-c65200-005b28-8876ec */
:root {
  --cold-lips: #9599ff;
  --sea-foam: #8ce5c4;
  --spill-the-beans: #9d3013;
  --dark-orange: #c65200;
  --o-tannenbaum: #005b28;
  --matt-purple: #8876ec;
}

Tailwind CSS v4

/* Cold Lips to Matt Purple — https://swatchly.xyz/palette/9599ff-8ce5c4-9d3013-c65200-005b28-8876ec */
@theme {
  --color-cold-lips: #9599ff;
  --color-cold-lips-50: #f5f6ff;
  --color-cold-lips-100: #e9ecff;
  --color-cold-lips-200: #d3d7ff;
  --color-cold-lips-300: #b9beff;
  --color-cold-lips-400: #9599ff;
  --color-cold-lips-500: #7a7cdf;
  --color-cold-lips-600: #6061c0;
  --color-cold-lips-700: #4b4aa0;
  --color-cold-lips-800: #3a3783;
  --color-cold-lips-900: #2b2869;
  --color-cold-lips-950: #1a1745;
  --color-sea-foam: #8ce5c4;
  --color-sea-foam-50: #cbfde9;
  --color-sea-foam-100: #bbf3dd;
  --color-sea-foam-200: #8ce5c4;
  --color-sea-foam-300: #81cdb0;
  --color-sea-foam-400: #5ab092;
  --color-sea-foam-500: #3a9578;
  --color-sea-foam-600: #1c7b5f;
  --color-sea-foam-700: #00644b;
  --color-sea-foam-800: #004f3b;
  --color-sea-foam-900: #003d2d;
  --color-sea-foam-950: #00261b;
  --color-spill-the-beans: #9d3013;
  --color-spill-the-beans-50: #fff2ee;
  --color-spill-the-beans-100: #ffe4dd;
  --color-spill-the-beans-200: #ffcbbd;
  --color-spill-the-beans-300: #ffaa95;
  --color-spill-the-beans-400: #f08165;
  --color-spill-the-beans-500: #d46347;
  --color-spill-the-beans-600: #b6492e;
  --color-spill-the-beans-700: #9d3013;
  --color-spill-the-beans-800: #7d230a;
  --color-spill-the-beans-900: #641602;
  --color-spill-the-beans-950: #420a00;
  --color-dark-orange: #c65200;
  --color-dark-orange-50: #ffefe8;
  --color-dark-orange-100: #ffdfd1;
  --color-dark-orange-200: #ffc1a5;
  --color-dark-orange-300: #ff9c6d;
  --color-dark-orange-400: #e67235;
  --color-dark-orange-500: #c65200;
  --color-dark-orange-600: #a14100;
  --color-dark-orange-700: #813300;
  --color-dark-orange-800: #672700;
  --color-dark-orange-900: #521d00;
  --color-dark-orange-950: #361000;
  --color-o-tannenbaum: #005b28;
  --color-o-tannenbaum-50: #dfffe5;
  --color-o-tannenbaum-100: #cbf9d4;
  --color-o-tannenbaum-200: #b0e8bc;
  --color-o-tannenbaum-300: #95d4a3;
  --color-o-tannenbaum-400: #71b882;
  --color-o-tannenbaum-500: #549e67;
  --color-o-tannenbaum-600: #39844f;
  --color-o-tannenbaum-700: #256d3c;
  --color-o-tannenbaum-800: #005b28;
  --color-o-tannenbaum-900: #084620;
  --color-o-tannenbaum-950: #012d11;
  --color-matt-purple: #8876ec;
  --color-matt-purple-50: #f5f5ff;
  --color-matt-purple-100: #ebebff;
  --color-matt-purple-200: #d7d5ff;
  --color-matt-purple-300: #c1bcff;
  --color-matt-purple-400: #a295ff;
  --color-matt-purple-500: #8876ec;
  --color-matt-purple-600: #6e5acb;
  --color-matt-purple-700: #5742ab;
  --color-matt-purple-800: #44308d;
  --color-matt-purple-900: #342271;
  --color-matt-purple-950: #20124b;
}

Similar palettes