Bermuda Onion to Violaceous Color Palette

About this palette

Bermuda Onion to Violaceous is a 4-color cool, monochromatic palette: #915C99 (Bermuda Onion), #FFF5FE (Walkie Chalkie), #402941 (Purple Void), #C18BBD (Violaceous). It mixes pink, white, purple tones and feels cool overall. The strongest text pairing is #FFF5FE on #402941 with a contrast ratio of 12.25:1, and 3 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Bermuda Onion	rgb(145, 92, 153)	hsl(292, 25%, 48%)
Walkie Chalkie	rgb(255, 245, 254)	hsl(306, 100%, 98%)
Purple Void	rgb(64, 41, 65)	hsl(298, 23%, 21%)
Violaceous	rgb(193, 139, 189)	hsl(304, 30%, 65%)

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.25:1 Super#FFF5FE on #402941
Aa12.25:1 Super#402941 on #FFF5FE
Aa4.78:1 Good#402941 on #C18BBD
Aa4.78:1 Good#C18BBD on #402941
Aa4.71:1 Good#915C99 on #FFF5FE
Aa4.71:1 Good#FFF5FE on #915C99

Color blindness preview

CSS variables

/* Bermuda Onion to Violaceous — https://swatchly.xyz/palette/915c99-fff5fe-402941-c18bbd */
:root {
  --bermuda-onion: #915c99;
  --walkie-chalkie: #fff5fe;
  --purple-void: #402941;
  --violaceous: #c18bbd;
}

Tailwind CSS v4

/* Bermuda Onion to Violaceous — https://swatchly.xyz/palette/915c99-fff5fe-402941-c18bbd */
@theme {
  --color-bermuda-onion: #915c99;
  --color-bermuda-onion-50: #fdf0ff;
  --color-bermuda-onion-100: #fce3ff;
  --color-bermuda-onion-200: #f4c9fa;
  --color-bermuda-onion-300: #e2b2e9;
  --color-bermuda-onion-400: #c691ce;
  --color-bermuda-onion-500: #ac75b4;
  --color-bermuda-onion-600: #915c99;
  --color-bermuda-onion-700: #76467d;
  --color-bermuda-onion-800: #5e3365;
  --color-bermuda-onion-900: #4a254f;
  --color-bermuda-onion-950: #2f1533;
  --color-walkie-chalkie: #fff5fe;
  --color-walkie-chalkie-50: #fff5fe;
  --color-walkie-chalkie-100: #f2ecf1;
  --color-walkie-chalkie-200: #ded7dd;
  --color-walkie-chalkie-300: #c8c0c7;
  --color-walkie-chalkie-400: #a89fa7;
  --color-walkie-chalkie-500: #8c838b;
  --color-walkie-chalkie-600: #716970;
  --color-walkie-chalkie-700: #5a5259;
  --color-walkie-chalkie-800: #474046;
  --color-walkie-chalkie-900: #363136;
  --color-walkie-chalkie-950: #221e21;
  --color-purple-void: #402941;
  --color-purple-void-50: #ffefff;
  --color-purple-void-100: #f7e4f7;
  --color-purple-void-200: #e5cfe6;
  --color-purple-void-300: #d0b8d1;
  --color-purple-void-400: #b297b3;
  --color-purple-void-500: #977c97;
  --color-purple-void-600: #7b627c;
  --color-purple-void-700: #634c64;
  --color-purple-void-800: #4e3a4f;
  --color-purple-void-900: #402941;
  --color-purple-void-950: #261a27;
  --color-violaceous: #c18bbd;
  --color-violaceous-50: #ffeffd;
  --color-violaceous-100: #ffdffc;
  --color-violaceous-200: #f1c7ee;
  --color-violaceous-300: #deaeda;
  --color-violaceous-400: #c18bbd;
  --color-violaceous-500: #a470a1;
  --color-violaceous-600: #885785;
  --color-violaceous-700: #6f426c;
  --color-violaceous-800: #593156;
  --color-violaceous-900: #462544;
  --color-violaceous-950: #2d152c;
}