Viking Diva to What’s Left Color Palette

About this palette

Viking Diva to What’s Left is a 5-color pastel, light palette: #C2BDEA (Viking Diva), #D7CC8A (Master Key), #FCBEE8 (Pretty in Pink), #A1EBF5 (Permafrost), #FFF2EA (What’s Left). It mixes purple, yellow, pink, turquoise, white tones and feels balanced overall. The strongest text pairing is #C2BDEA on #FFF2EA with a contrast ratio of 1.63:1, and 0 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Viking Diva	rgb(194, 189, 234)	hsl(247, 52%, 83%)
Master Key	rgb(215, 204, 138)	hsl(51, 49%, 69%)
Pretty in Pink	rgb(252, 190, 232)	hsl(319, 91%, 87%)
Permafrost	rgb(161, 235, 245)	hsl(187, 81%, 80%)
What’s Left	rgb(255, 242, 234)	hsl(23, 100%, 96%)

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.

Color blindness preview

CSS variables

/* Viking Diva to What’s Left — https://swatchly.xyz/palette/c2bdea-d7cc8a-fcbee8-a1ebf5-fff2ea */
:root {
  --viking-diva: #c2bdea;
  --master-key: #d7cc8a;
  --pretty-in-pink: #fcbee8;
  --permafrost: #a1ebf5;
  --what-s-left: #fff2ea;
}

Tailwind CSS v4

/* Viking Diva to What’s Left — https://swatchly.xyz/palette/c2bdea-d7cc8a-fcbee8-a1ebf5-fff2ea */
@theme {
  --color-viking-diva: #c2bdea;
  --color-viking-diva-50: #f6f5ff;
  --color-viking-diva-100: #eceaff;
  --color-viking-diva-200: #d8d5f7;
  --color-viking-diva-300: #c2bdea;
  --color-viking-diva-400: #a29ec7;
  --color-viking-diva-500: #8782ab;
  --color-viking-diva-600: #6c678f;
  --color-viking-diva-700: #555074;
  --color-viking-diva-800: #423e5d;
  --color-viking-diva-900: #322f49;
  --color-viking-diva-950: #1f1c2f;
  --color-master-key: #d7cc8a;
  --color-master-key-50: #fffbe1;
  --color-master-key-100: #f9f3cd;
  --color-master-key-200: #e8e1b4;
  --color-master-key-300: #d7cc8a;
  --color-master-key-400: #b5ab6e;
  --color-master-key-500: #988d4d;
  --color-master-key-600: #7c7131;
  --color-master-key-700: #63591c;
  --color-master-key-800: #4d440c;
  --color-master-key-900: #3b3303;
  --color-master-key-950: #251f00;
  --color-pretty-in-pink: #fcbee8;
  --color-pretty-in-pink-50: #ffedf9;
  --color-pretty-in-pink-100: #ffddf3;
  --color-pretty-in-pink-200: #fcbee8;
  --color-pretty-in-pink-300: #e0abcf;
  --color-pretty-in-pink-400: #c38bb1;
  --color-pretty-in-pink-500: #a86f97;
  --color-pretty-in-pink-600: #8c567c;
  --color-pretty-in-pink-700: #724264;
  --color-pretty-in-pink-800: #5c3250;
  --color-pretty-in-pink-900: #48243e;
  --color-pretty-in-pink-950: #2f1527;
  --color-permafrost: #a1ebf5;
  --color-permafrost-50: #eafdff;
  --color-permafrost-100: #cef8fe;
  --color-permafrost-200: #a1ebf5;
  --color-permafrost-300: #95d1d9;
  --color-permafrost-400: #6db2bb;
  --color-permafrost-500: #4c959f;
  --color-permafrost-600: #307982;
  --color-permafrost-700: #196169;
  --color-permafrost-800: #074b53;
  --color-permafrost-900: #003a41;
  --color-permafrost-950: #002529;
  --color-what-s-left: #fff2ea;
  --color-what-s-left-50: #fff2ea;
  --color-what-s-left-100: #f1e9e4;
  --color-what-s-left-200: #dfd5cf;
  --color-what-s-left-300: #c9beb8;
  --color-what-s-left-400: #aa9f98;
  --color-what-s-left-500: #8f847c;
  --color-what-s-left-600: #746963;
  --color-what-s-left-700: #5d534d;
  --color-what-s-left-800: #49403b;
  --color-what-s-left-900: #38312d;
  --color-what-s-left-950: #231e1b;
}