Sunshone Plum to Kissed by Mist Color Palette

About this palette

Sunshone Plum to Kissed by Mist is a 4-color cool, monochromatic palette: #846396 (Sunshone Plum), #B185C1 (Wisteria), #3C2A3F (Sanctum of Shadows), #F0D0FF (Kissed by Mist). It mixes purple tones and feels cool overall. The strongest text pairing is #3C2A3F on #F0D0FF with a contrast ratio of 9.51:1, and 1 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Sunshone Plum	rgb(132, 99, 150)	hsl(279, 20%, 49%)
Wisteria	rgb(177, 133, 193)	hsl(284, 33%, 64%)
Sanctum of Shadows	rgb(60, 42, 63)	hsl(291, 20%, 21%)
Kissed by Mist	rgb(240, 208, 255)	hsl(281, 100%, 91%)

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.

Aa9.51:1 Very good#3C2A3F on #F0D0FF
Aa9.51:1 Very good#F0D0FF on #3C2A3F
Aa4.38:1 Poor#B185C1 on #3C2A3F
Aa4.38:1 Poor#3C2A3F on #B185C1
Aa3.61:1 Poor#846396 on #F0D0FF
Aa3.61:1 Poor#F0D0FF on #846396

Color blindness preview

CSS variables

/* Sunshone Plum to Kissed by Mist — https://swatchly.xyz/palette/846396-b185c1-3c2a3f-f0d0ff */
:root {
  --sunshone-plum: #846396;
  --wisteria: #b185c1;
  --sanctum-of-shadows: #3c2a3f;
  --kissed-by-mist: #f0d0ff;
}

Tailwind CSS v4

/* Sunshone Plum to Kissed by Mist — https://swatchly.xyz/palette/846396-b185c1-3c2a3f-f0d0ff */
@theme {
  --color-sunshone-plum: #846396;
  --color-sunshone-plum-50: #faf1ff;
  --color-sunshone-plum-100: #f6e6ff;
  --color-sunshone-plum-200: #e9cef8;
  --color-sunshone-plum-300: #d5b7e6;
  --color-sunshone-plum-400: #b897cb;
  --color-sunshone-plum-500: #9e7cb1;
  --color-sunshone-plum-600: #846396;
  --color-sunshone-plum-700: #6a4c7b;
  --color-sunshone-plum-800: #543a62;
  --color-sunshone-plum-900: #412b4d;
  --color-sunshone-plum-950: #291932;
  --color-wisteria: #b185c1;
  --color-wisteria-50: #faecff;
  --color-wisteria-100: #f5dcff;
  --color-wisteria-200: #e6c2f3;
  --color-wisteria-300: #d0a8df;
  --color-wisteria-400: #b185c1;
  --color-wisteria-500: #966ca6;
  --color-wisteria-600: #7c548b;
  --color-wisteria-700: #654072;
  --color-wisteria-800: #51315c;
  --color-wisteria-900: #40254a;
  --color-wisteria-950: #2a1631;
  --color-sanctum-of-shadows: #3c2a3f;
  --color-sanctum-of-shadows-50: #fdf0ff;
  --color-sanctum-of-shadows-100: #f4e6f6;
  --color-sanctum-of-shadows-200: #e2d1e5;
  --color-sanctum-of-shadows-300: #cdb9d0;
  --color-sanctum-of-shadows-400: #ae99b1;
  --color-sanctum-of-shadows-500: #927d96;
  --color-sanctum-of-shadows-600: #77637a;
  --color-sanctum-of-shadows-700: #5f4d62;
  --color-sanctum-of-shadows-800: #4b3b4d;
  --color-sanctum-of-shadows-900: #3c2a3f;
  --color-sanctum-of-shadows-950: #241a25;
  --color-kissed-by-mist: #f0d0ff;
  --color-kissed-by-mist-50: #fcf7ff;
  --color-kissed-by-mist-100: #f8ebff;
  --color-kissed-by-mist-200: #f0d0ff;
  --color-kissed-by-mist-300: #d5bbe1;
  --color-kissed-by-mist-400: #b699c3;
  --color-kissed-by-mist-500: #9a7ca7;
  --color-kissed-by-mist-600: #7d618a;
  --color-kissed-by-mist-700: #644b70;
  --color-kissed-by-mist-800: #4e3858;
  --color-kissed-by-mist-900: #3d2a45;
  --color-kissed-by-mist-950: #27192d;
}