Violet Heaven to Dreamy Candy Forest color palette

CCB3FFViolet Heaven E33977Fantasy Romance 670043Merlot EBFFEASnow White 007800Poblano B08FFFDreamy Candy Forest

Open in generator Export PNG, PDF, ASE…

About this palette

Violet Heaven to Dreamy Candy Forest is a 6-color palette: #CCB3FF (Violet Heaven), #E33977 (Fantasy Romance), #670043 (Merlot), #EBFFEA (Snow White), #007800 (Poblano), #B08FFF (Dreamy Candy Forest). It mixes purple, pink, red, white, green tones and feels cool overall. The strongest text pairing is #670043 on #EBFFEA with a contrast ratio of 12.08:1, and 4 of its 15 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Violet Heaven	rgb(204, 179, 255)	hsl(260, 100%, 85%)
Fantasy Romance	rgb(227, 57, 119)	hsl(338, 75%, 56%)
Merlot	rgb(103, 0, 67)	hsl(321, 100%, 20%)
Snow White	rgb(235, 255, 234)	hsl(117, 100%, 96%)
Poblano	rgb(0, 120, 0)	hsl(120, 100%, 24%)
Dreamy Candy Forest	rgb(176, 143, 255)	hsl(258, 100%, 78%)

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.

Aa12.08:1 Super#670043 on #EBFFEA
Aa12.08:1 Super#EBFFEA on #670043
Aa6.91:1 Good#CCB3FF on #670043
Aa6.91:1 Good#670043 on #CCB3FF
Aa5.43:1 Good#EBFFEA on #007800
Aa5.43:1 Good#007800 on #EBFFEA
Aa4.96:1 Good#670043 on #B08FFF
Aa4.96:1 Good#B08FFF on #670043

Color blindness preview

CSS variables

/* Violet Heaven to Dreamy Candy Forest — https://swatchly.xyz/palette/ccb3ff-e33977-670043-ebffea-007800-b08fff */
:root {
  --violet-heaven: #ccb3ff;
  --fantasy-romance: #e33977;
  --merlot: #670043;
  --snow-white: #ebffea;
  --poblano: #007800;
  --dreamy-candy-forest: #b08fff;
}

Tailwind CSS v4

/* Violet Heaven to Dreamy Candy Forest — https://swatchly.xyz/palette/ccb3ff-e33977-670043-ebffea-007800-b08fff */
@theme {
  --color-violet-heaven: #ccb3ff;
  --color-violet-heaven-50: #f7f4ff;
  --color-violet-heaven-100: #efe8ff;
  --color-violet-heaven-200: #ded0ff;
  --color-violet-heaven-300: #ccb3ff;
  --color-violet-heaven-400: #ac94db;
  --color-violet-heaven-500: #9078bf;
  --color-violet-heaven-600: #755da1;
  --color-violet-heaven-700: #5e4785;
  --color-violet-heaven-800: #4a366c;
  --color-violet-heaven-900: #392855;
  --color-violet-heaven-950: #241738;
  --color-fantasy-romance: #e33977;
  --color-fantasy-romance-50: #fff1f4;
  --color-fantasy-romance-100: #ffe3e8;
  --color-fantasy-romance-200: #ffc5d2;
  --color-fantasy-romance-300: #ffa0b8;
  --color-fantasy-romance-400: #ff6093;
  --color-fantasy-romance-500: #e33977;
  --color-fantasy-romance-600: #c1115e;
  --color-fantasy-romance-700: #9d0049;
  --color-fantasy-romance-800: #7d0039;
  --color-fantasy-romance-900: #62002b;
  --color-fantasy-romance-950: #40001a;
  --color-merlot: #670043;
  --color-merlot-50: #fff1f7;
  --color-merlot-100: #ffe2ef;
  --color-merlot-200: #ffc4df;
  --color-merlot-300: #fba0cd;
  --color-merlot-400: #e07db0;
  --color-merlot-500: #c56095;
  --color-merlot-600: #a7477b;
  --color-merlot-700: #8c3364;
  --color-merlot-800: #732351;
  --color-merlot-900: #670043;
  --color-merlot-950: #3f0b2a;
  --color-snow-white: #ebffea;
  --color-snow-white-50: #ebffea;
  --color-snow-white-100: #e6f2e5;
  --color-snow-white-200: #d0decf;
  --color-snow-white-300: #b8c8b7;
  --color-snow-white-400: #97a896;
  --color-snow-white-500: #7b8c7a;
  --color-snow-white-600: #60715f;
  --color-snow-white-700: #4b5a4a;
  --color-snow-white-800: #394739;
  --color-snow-white-900: #2b362b;
  --color-snow-white-950: #1a2219;
  --color-poblano: #007800;
  --color-poblano-50: #e1ffde;
  --color-poblano-100: #c0fcba;
  --color-poblano-200: #a1ea9b;
  --color-poblano-300: #80d379;
  --color-poblano-400: #55b34f;
  --color-poblano-500: #32952d;
  --color-poblano-600: #007800;
  --color-poblano-700: #005f00;
  --color-poblano-800: #004b00;
  --color-poblano-900: #003a00;
  --color-poblano-950: #002500;
  --color-dreamy-candy-forest: #b08fff;
  --color-dreamy-candy-forest-50: #f7f5ff;
  --color-dreamy-candy-forest-100: #efebff;
  --color-dreamy-candy-forest-200: #ded4ff;
  --color-dreamy-candy-forest-300: #cab9ff;
  --color-dreamy-candy-forest-400: #b08fff;
  --color-dreamy-candy-forest-500: #9472df;
  --color-dreamy-candy-forest-600: #7956bf;
  --color-dreamy-candy-forest-700: #6140a0;
  --color-dreamy-candy-forest-800: #4c2e83;
  --color-dreamy-candy-forest-900: #3b2068;
  --color-dreamy-candy-forest-950: #241145;
}