Creamy Mint to Purple Void color palette

B2FBA8Creamy Mint 69CF4EKoopa Green Shell AB6CB8Prickly Purple 00763ESucculents 412044Purple Void

About this palette

Creamy Mint to Purple Void is a 5-color cool palette: #B2FBA8 (Creamy Mint), #69CF4E (Koopa Green Shell), #AB6CB8 (Prickly Purple), #00763E (Succulents), #412044 (Purple Void). It mixes green, purple tones and feels cool overall. The strongest text pairing is #B2FBA8 on #412044 with a contrast ratio of 11.39:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Creamy Mint	rgb(178, 251, 168)	hsl(113, 91%, 82%)
Koopa Green Shell	rgb(105, 207, 78)	hsl(107, 57%, 56%)
Prickly Purple	rgb(171, 108, 184)	hsl(290, 35%, 57%)
Succulents	rgb(0, 118, 62)	hsl(152, 100%, 23%)
Purple Void	rgb(65, 32, 68)	hsl(295, 36%, 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.

Aa11.39:1 Very good#B2FBA8 on #412044
Aa11.39:1 Very good#412044 on #B2FBA8
Aa7.02:1 Very good#69CF4E on #412044
Aa7.02:1 Very good#412044 on #69CF4E
Aa4.71:1 Good#B2FBA8 on #00763E
Aa4.71:1 Good#00763E on #B2FBA8
Aa3.68:1 Poor#AB6CB8 on #412044
Aa3.68:1 Poor#412044 on #AB6CB8

Color blindness preview

CSS variables

/* Creamy Mint to Purple Void — https://swatchly.xyz/palette/b2fba8-69cf4e-ab6cb8-00763e-412044 */
:root {
  --creamy-mint: #b2fba8;
  --koopa-green-shell: #69cf4e;
  --prickly-purple: #ab6cb8;
  --succulents: #00763e;
  --purple-void: #412044;
}

Tailwind CSS v4

/* Creamy Mint to Purple Void — https://swatchly.xyz/palette/b2fba8-69cf4e-ab6cb8-00763e-412044 */
@theme {
  --color-creamy-mint: #b2fba8;
  --color-creamy-mint-50: #d3fdcd;
  --color-creamy-mint-100: #b2fba8;
  --color-creamy-mint-200: #ade3a5;
  --color-creamy-mint-300: #92cf8a;
  --color-creamy-mint-400: #6fb266;
  --color-creamy-mint-500: #52974a;
  --color-creamy-mint-600: #397d31;
  --color-creamy-mint-700: #26651e;
  --color-creamy-mint-800: #175010;
  --color-creamy-mint-900: #0d3e07;
  --color-creamy-mint-950: #042702;
  --color-koopa-green-shell: #69cf4e;
  --color-koopa-green-shell-50: #cbffbe;
  --color-koopa-green-shell-100: #b3f7a3;
  --color-koopa-green-shell-200: #94e480;
  --color-koopa-green-shell-300: #69cf4e;
  --color-koopa-green-shell-400: #4cb02f;
  --color-koopa-green-shell-500: #309600;
  --color-koopa-green-shell-600: #257a00;
  --color-koopa-green-shell-700: #1c6200;
  --color-koopa-green-shell-800: #144e00;
  --color-koopa-green-shell-900: #0e3e00;
  --color-koopa-green-shell-950: #062700;
  --color-prickly-purple: #ab6cb8;
  --color-prickly-purple-50: #fdf1ff;
  --color-prickly-purple-100: #fae3ff;
  --color-prickly-purple-200: #f5c5ff;
  --color-prickly-purple-300: #e3abee;
  --color-prickly-purple-400: #c688d3;
  --color-prickly-purple-500: #ab6cb8;
  --color-prickly-purple-600: #8e529a;
  --color-prickly-purple-700: #743c7f;
  --color-prickly-purple-800: #5d2c66;
  --color-prickly-purple-900: #491f51;
  --color-prickly-purple-950: #2f1135;
  --color-succulents: #00763e;
  --color-succulents-50: #deffe7;
  --color-succulents-100: #c1fad1;
  --color-succulents-200: #a2e7b6;
  --color-succulents-300: #81d19a;
  --color-succulents-400: #56b176;
  --color-succulents-500: #329359;
  --color-succulents-600: #00763e;
  --color-succulents-700: #005e30;
  --color-succulents-800: #004a24;
  --color-succulents-900: #00391b;
  --color-succulents-950: #00240f;
  --color-purple-void: #412044;
  --color-purple-void-50: #fef0ff;
  --color-purple-void-100: #fce1fd;
  --color-purple-void-200: #ebcced;
  --color-purple-void-300: #d6b3d9;
  --color-purple-void-400: #b892ba;
  --color-purple-void-500: #9b759e;
  --color-purple-void-600: #7f5b82;
  --color-purple-void-700: #654568;
  --color-purple-void-800: #4f3351;
  --color-purple-void-900: #412044;
  --color-purple-void-950: #261527;
}