Sanctum of Shadows to Mint Twist color palette

3B2E48Sanctum of Shadows 835434Cold Brew Coffee A0805EMulled Cider AFA5C7Lucius Lilac 9ACDC7Mint Twist

Open in generator Export PNG, PDF, ASE…

About this palette

Sanctum of Shadows to Mint Twist is a 5-color muted, cool, vintage palette: #3B2E48 (Sanctum of Shadows), #835434 (Cold Brew Coffee), #A0805E (Mulled Cider), #AFA5C7 (Lucius Lilac), #9ACDC7 (Mint Twist). It mixes purple, brown, orange, turquoise tones and feels cool overall. The strongest text pairing is #3B2E48 on #9ACDC7 with a contrast ratio of 7.14:1, and 2 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Sanctum of Shadows	rgb(59, 46, 72)	hsl(270, 22%, 23%)
Cold Brew Coffee	rgb(131, 84, 52)	hsl(24, 43%, 36%)
Mulled Cider	rgb(160, 128, 94)	hsl(31, 26%, 50%)
Lucius Lilac	rgb(175, 165, 199)	hsl(258, 23%, 71%)
Mint Twist	rgb(154, 205, 199)	hsl(173, 34%, 70%)

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.

Aa7.14:1 Very good#3B2E48 on #9ACDC7
Aa7.14:1 Very good#9ACDC7 on #3B2E48
Aa5.41:1 Good#3B2E48 on #AFA5C7
Aa5.41:1 Good#AFA5C7 on #3B2E48
Aa3.63:1 Poor#835434 on #9ACDC7
Aa3.63:1 Poor#9ACDC7 on #835434
Aa3.44:1 Poor#3B2E48 on #A0805E
Aa3.44:1 Poor#A0805E on #3B2E48

Color blindness preview

CSS variables

/* Sanctum of Shadows to Mint Twist — https://swatchly.xyz/palette/3b2e48-835434-a0805e-afa5c7-9acdc7 */
:root {
  --sanctum-of-shadows: #3b2e48;
  --cold-brew-coffee: #835434;
  --mulled-cider: #a0805e;
  --lucius-lilac: #afa5c7;
  --mint-twist: #9acdc7;
}

Tailwind CSS v4

/* Sanctum of Shadows to Mint Twist — https://swatchly.xyz/palette/3b2e48-835434-a0805e-afa5c7-9acdc7 */
@theme {
  --color-sanctum-of-shadows: #3b2e48;
  --color-sanctum-of-shadows-50: #f8f2ff;
  --color-sanctum-of-shadows-100: #f0e6fb;
  --color-sanctum-of-shadows-200: #ddd2ea;
  --color-sanctum-of-shadows-300: #c8bad6;
  --color-sanctum-of-shadows-400: #a99bb9;
  --color-sanctum-of-shadows-500: #8e809e;
  --color-sanctum-of-shadows-600: #746683;
  --color-sanctum-of-shadows-700: #5d506a;
  --color-sanctum-of-shadows-800: #4a3e55;
  --color-sanctum-of-shadows-900: #3b2e48;
  --color-sanctum-of-shadows-950: #241d2b;
  --color-cold-brew-coffee: #835434;
  --color-cold-brew-coffee-50: #fff2eb;
  --color-cold-brew-coffee-100: #ffe3d1;
  --color-cold-brew-coffee-200: #f3caaf;
  --color-cold-brew-coffee-300: #deaf91;
  --color-cold-brew-coffee-400: #bf8d6c;
  --color-cold-brew-coffee-500: #a1704f;
  --color-cold-brew-coffee-600: #835434;
  --color-cold-brew-coffee-700: #6a4126;
  --color-cold-brew-coffee-800: #55321a;
  --color-cold-brew-coffee-900: #432611;
  --color-cold-brew-coffee-950: #2b1608;
  --color-mulled-cider: #a0805e;
  --color-mulled-cider-50: #fff3e7;
  --color-mulled-cider-100: #fde7d1;
  --color-mulled-cider-200: #edd3b8;
  --color-mulled-cider-300: #d9bc9d;
  --color-mulled-cider-400: #bb9c7a;
  --color-mulled-cider-500: #a0805e;
  --color-mulled-cider-600: #846645;
  --color-mulled-cider-700: #6b5032;
  --color-mulled-cider-800: #553d23;
  --color-mulled-cider-900: #432e18;
  --color-mulled-cider-950: #2a1c0c;
  --color-lucius-lilac: #afa5c7;
  --color-lucius-lilac-50: #f9f7ff;
  --color-lucius-lilac-100: #f2edff;
  --color-lucius-lilac-200: #e1daf3;
  --color-lucius-lilac-300: #ccc4e1;
  --color-lucius-lilac-400: #afa5c7;
  --color-lucius-lilac-500: #9288a9;
  --color-lucius-lilac-600: #756c8b;
  --color-lucius-lilac-700: #5d5471;
  --color-lucius-lilac-800: #484059;
  --color-lucius-lilac-900: #373045;
  --color-lucius-lilac-950: #211c2b;
  --color-mint-twist: #9acdc7;
  --color-mint-twist-50: #e0fcf9;
  --color-mint-twist-100: #d4f3ef;
  --color-mint-twist-200: #bbe1dc;
  --color-mint-twist-300: #9acdc7;
  --color-mint-twist-400: #7dada7;
  --color-mint-twist-500: #60918c;
  --color-mint-twist-600: #467671;
  --color-mint-twist-700: #325e5a;
  --color-mint-twist-800: #234a46;
  --color-mint-twist-900: #183936;
  --color-mint-twist-950: #0c2422;
}