Start generating

Cosmic Explorer to Sweet Mint Pesto color palette

531044Cosmic Explorer960089Persian Luxury Purple68994BBitter Leaf3ACDBAPristine OceanicC6F0A3Sweet Mint Pesto
Open in generator Export PNG, PDF, ASE…

About this palette

Cosmic Explorer to Sweet Mint Pesto is a 5-color cool palette: #531044 (Cosmic Explorer), #960089 (Persian Luxury Purple), #68994B (Bitter Leaf), #3ACDBA (Pristine Oceanic), #C6F0A3 (Sweet Mint Pesto). It mixes purple, pink, green, turquoise tones and feels cool overall. The strongest text pairing is #531044 on #C6F0A3 with a contrast ratio of 10.75:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Cosmic Explorerrgb(83, 16, 68)hsl(313, 68%, 19%)
Persian Luxury Purplergb(150, 0, 137)hsl(305, 100%, 29%)
Bitter Leafrgb(104, 153, 75)hsl(98, 34%, 45%)
Pristine Oceanicrgb(58, 205, 186)hsl(172, 60%, 52%)
Sweet Mint Pestorgb(198, 240, 163)hsl(93, 72%, 79%)

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.

  • Aa10.75:1 Very good#531044 on #C6F0A3
  • Aa10.75:1 Very good#C6F0A3 on #531044
  • Aa6.96:1 Good#531044 on #3ACDBA
  • Aa6.96:1 Good#3ACDBA on #531044
  • Aa6.17:1 Good#960089 on #C6F0A3
  • Aa6.17:1 Good#C6F0A3 on #960089
  • Aa4.10:1 Poor#531044 on #68994B
  • Aa4.10:1 Poor#68994B on #531044

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Cosmic Explorer to Sweet Mint Pesto — https://swatchly.xyz/palette/531044-960089-68994b-3acdba-c6f0a3 */
:root {
  --cosmic-explorer: #531044;
  --persian-luxury-purple: #960089;
  --bitter-leaf: #68994b;
  --pristine-oceanic: #3acdba;
  --sweet-mint-pesto: #c6f0a3;
}

Tailwind CSS v4

/* Cosmic Explorer to Sweet Mint Pesto — https://swatchly.xyz/palette/531044-960089-68994b-3acdba-c6f0a3 */
@theme {
  --color-cosmic-explorer: #531044;
  --color-cosmic-explorer-50: #fff0fa;
  --color-cosmic-explorer-100: #ffe1f5;
  --color-cosmic-explorer-200: #fec2eb;
  --color-cosmic-explorer-300: #eba8d6;
  --color-cosmic-explorer-400: #ce85b8;
  --color-cosmic-explorer-500: #b2699d;
  --color-cosmic-explorer-600: #944f81;
  --color-cosmic-explorer-700: #783a67;
  --color-cosmic-explorer-800: #602a52;
  --color-cosmic-explorer-900: #531044;
  --color-cosmic-explorer-950: #301028;
  --color-persian-luxury-purple: #960089;
  --color-persian-luxury-purple-50: #fff0fc;
  --color-persian-luxury-purple-100: #ffe0f9;
  --color-persian-luxury-purple-200: #ffc1f3;
  --color-persian-luxury-purple-300: #ff99ee;
  --color-persian-luxury-purple-400: #e96cd8;
  --color-persian-luxury-purple-500: #ce4bbd;
  --color-persian-luxury-purple-600: #af2da1;
  --color-persian-luxury-purple-700: #960089;
  --color-persian-luxury-purple-800: #77006c;
  --color-persian-luxury-purple-900: #5d0054;
  --color-persian-luxury-purple-950: #3d0037;
  --color-bitter-leaf: #68994b;
  --color-bitter-leaf-50: #e6ffd9;
  --color-bitter-leaf-100: #d7f8c7;
  --color-bitter-leaf-200: #c0e7ac;
  --color-bitter-leaf-300: #a6d28f;
  --color-bitter-leaf-400: #84b469;
  --color-bitter-leaf-500: #68994b;
  --color-bitter-leaf-600: #4e7d30;
  --color-bitter-leaf-700: #39641c;
  --color-bitter-leaf-800: #294f0d;
  --color-bitter-leaf-900: #1d3d04;
  --color-bitter-leaf-950: #0f2601;
  --color-pristine-oceanic: #3acdba;
  --color-pristine-oceanic-50: #b7fff2;
  --color-pristine-oceanic-100: #a1f5e6;
  --color-pristine-oceanic-200: #7be2d1;
  --color-pristine-oceanic-300: #3acdba;
  --color-pristine-oceanic-400: #00ae9d;
  --color-pristine-oceanic-500: #009283;
  --color-pristine-oceanic-600: #00766a;
  --color-pristine-oceanic-700: #005f55;
  --color-pristine-oceanic-800: #004c43;
  --color-pristine-oceanic-900: #003c35;
  --color-pristine-oceanic-950: #002621;
  --color-sweet-mint-pesto: #c6f0a3;
  --color-sweet-mint-pesto-50: #f5ffee;
  --color-sweet-mint-pesto-100: #e4fcd1;
  --color-sweet-mint-pesto-200: #c6f0a3;
  --color-sweet-mint-pesto-300: #b3d597;
  --color-sweet-mint-pesto-400: #8fb56f;
  --color-sweet-mint-pesto-500: #72984f;
  --color-sweet-mint-pesto-600: #577b33;
  --color-sweet-mint-pesto-700: #41621f;
  --color-sweet-mint-pesto-800: #304c0f;
  --color-sweet-mint-pesto-900: #233b06;
  --color-sweet-mint-pesto-950: #142502;
}

Similar palettes