Dreamy Candy Forest to Wasabi Nori Color Palette

About this palette

Dreamy Candy Forest to Wasabi Nori is a 5-color cool palette: #C488DA (Dreamy Candy Forest), #9561AA (Lusty Lavender), #C7C075 (Soda Pop), #006A5B (Terrestrial), #303800 (Wasabi Nori). It mixes purple, yellow, turquoise, green tones and feels cool overall. The strongest text pairing is #C7C075 on #303800 with a contrast ratio of 6.64:1, and 2 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Dreamy Candy Forest	rgb(196, 136, 218)	hsl(284, 53%, 69%)
Lusty Lavender	rgb(149, 97, 170)	hsl(283, 30%, 52%)
Soda Pop	rgb(199, 192, 117)	hsl(55, 42%, 62%)
Terrestrial	rgb(0, 106, 91)	hsl(172, 100%, 21%)
Wasabi Nori	rgb(48, 56, 0)	hsl(69, 100%, 11%)

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.

Aa6.64:1 Good#C7C075 on #303800
Aa6.64:1 Good#303800 on #C7C075
Aa4.66:1 Good#C488DA on #303800
Aa4.66:1 Good#303800 on #C488DA
Aa3.49:1 Poor#C7C075 on #006A5B
Aa3.49:1 Poor#006A5B on #C7C075

Color blindness preview

CSS variables

/* Dreamy Candy Forest to Wasabi Nori — https://swatchly.xyz/palette/c488da-9561aa-c7c075-006a5b-303800 */
:root {
  --dreamy-candy-forest: #c488da;
  --lusty-lavender: #9561aa;
  --soda-pop: #c7c075;
  --terrestrial: #006a5b;
  --wasabi-nori: #303800;
}

Tailwind CSS v4

/* Dreamy Candy Forest to Wasabi Nori — https://swatchly.xyz/palette/c488da-9561aa-c7c075-006a5b-303800 */
@theme {
  --color-dreamy-candy-forest: #c488da;
  --color-dreamy-candy-forest-50: #fbf2ff;
  --color-dreamy-candy-forest-100: #f8e4ff;
  --color-dreamy-candy-forest-200: #f0c8ff;
  --color-dreamy-candy-forest-300: #e0acf3;
  --color-dreamy-candy-forest-400: #c488da;
  --color-dreamy-candy-forest-500: #a76cbc;
  --color-dreamy-candy-forest-600: #8a529e;
  --color-dreamy-candy-forest-700: #703d83;
  --color-dreamy-candy-forest-800: #5a2c6a;
  --color-dreamy-candy-forest-900: #461f54;
  --color-dreamy-candy-forest-950: #2d1137;
  --color-lusty-lavender: #9561aa;
  --color-lusty-lavender-50: #faeeff;
  --color-lusty-lavender-100: #f5dcff;
  --color-lusty-lavender-200: #e9befb;
  --color-lusty-lavender-300: #d3a2e7;
  --color-lusty-lavender-400: #b37fc8;
  --color-lusty-lavender-500: #9561aa;
  --color-lusty-lavender-600: #7b4a8e;
  --color-lusty-lavender-700: #643875;
  --color-lusty-lavender-800: #502a5f;
  --color-lusty-lavender-900: #401f4c;
  --color-lusty-lavender-950: #291133;
  --color-soda-pop: #c7c075;
  --color-soda-pop-50: #f9f5cb;
  --color-soda-pop-100: #efebbc;
  --color-soda-pop-200: #dcd79f;
  --color-soda-pop-300: #c7c075;
  --color-soda-pop-400: #a8a15a;
  --color-soda-pop-500: #8d863c;
  --color-soda-pop-600: #736c21;
  --color-soda-pop-700: #5d560b;
  --color-soda-pop-800: #494300;
  --color-soda-pop-900: #393400;
  --color-soda-pop-950: #242000;
  --color-terrestrial: #006a5b;
  --color-terrestrial-50: #d8fff5;
  --color-terrestrial-100: #c6f8eb;
  --color-terrestrial-200: #ace7d9;
  --color-terrestrial-300: #8ed3c3;
  --color-terrestrial-400: #67b6a5;
  --color-terrestrial-500: #479b8a;
  --color-terrestrial-600: #2a8171;
  --color-terrestrial-700: #006a5b;
  --color-terrestrial-800: #005347;
  --color-terrestrial-900: #004036;
  --color-terrestrial-950: #002922;
  --color-wasabi-nori: #303800;
  --color-wasabi-nori-50: #f2fadb;
  --color-wasabi-nori-100: #e8f0cd;
  --color-wasabi-nori-200: #d4ddb4;
  --color-wasabi-nori-300: #bdc798;
  --color-wasabi-nori-400: #9da875;
  --color-wasabi-nori-500: #828d58;
  --color-wasabi-nori-600: #68723f;
  --color-wasabi-nori-700: #525b2c;
  --color-wasabi-nori-800: #40471e;
  --color-wasabi-nori-900: #303800;
  --color-wasabi-nori-950: #1e2208;
}