Bermuda Onion to Twilight Express color palette

955F9FBermuda Onion 798CE9Perrywinkle DDBB5ECrisps 12331DPitch-Black Forests 1D3C7ATwilight Express

About this palette

Bermuda Onion to Twilight Express is a 5-color cool palette: #955F9F (Bermuda Onion), #798CE9 (Perrywinkle), #DDBB5E (Crisps), #12331D (Pitch-Black Forests), #1D3C7A (Twilight Express). It mixes purple, blue, yellow, green tones and feels cool overall. The strongest text pairing is #DDBB5E on #12331D with a contrast ratio of 7.48:1, and 2 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Bermuda Onion	rgb(149, 95, 159)	hsl(291, 25%, 50%)
Perrywinkle	rgb(121, 140, 233)	hsl(230, 72%, 69%)
Crisps	rgb(221, 187, 94)	hsl(44, 65%, 62%)
Pitch-Black Forests	rgb(18, 51, 29)	hsl(140, 48%, 14%)
Twilight Express	rgb(29, 60, 122)	hsl(220, 62%, 30%)

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.48:1 Very good#DDBB5E on #12331D
Aa7.48:1 Very good#12331D on #DDBB5E
Aa5.73:1 Good#DDBB5E on #1D3C7A
Aa5.73:1 Good#1D3C7A on #DDBB5E
Aa4.44:1 Poor#798CE9 on #12331D
Aa4.44:1 Poor#12331D on #798CE9
Aa3.41:1 Poor#798CE9 on #1D3C7A
Aa3.41:1 Poor#1D3C7A on #798CE9

Color blindness preview

CSS variables

/* Bermuda Onion to Twilight Express — https://swatchly.xyz/palette/955f9f-798ce9-ddbb5e-12331d-1d3c7a */
:root {
  --bermuda-onion: #955f9f;
  --perrywinkle: #798ce9;
  --crisps: #ddbb5e;
  --pitch-black-forests: #12331d;
  --twilight-express: #1d3c7a;
}

Tailwind CSS v4

/* Bermuda Onion to Twilight Express — https://swatchly.xyz/palette/955f9f-798ce9-ddbb5e-12331d-1d3c7a */
@theme {
  --color-bermuda-onion: #955f9f;
  --color-bermuda-onion-50: #fdf0ff;
  --color-bermuda-onion-100: #fbe5ff;
  --color-bermuda-onion-200: #f5cbfd;
  --color-bermuda-onion-300: #e3b3ec;
  --color-bermuda-onion-400: #c893d2;
  --color-bermuda-onion-500: #af78b9;
  --color-bermuda-onion-600: #955f9f;
  --color-bermuda-onion-700: #794883;
  --color-bermuda-onion-800: #613569;
  --color-bermuda-onion-900: #4c2653;
  --color-bermuda-onion-950: #311536;
  --color-perrywinkle: #798ce9;
  --color-perrywinkle-50: #ebf0ff;
  --color-perrywinkle-100: #dbe3ff;
  --color-perrywinkle-200: #becbff;
  --color-perrywinkle-300: #9db0ff;
  --color-perrywinkle-400: #798ce9;
  --color-perrywinkle-500: #6273cd;
  --color-perrywinkle-600: #4c5aaf;
  --color-perrywinkle-700: #3b4693;
  --color-perrywinkle-800: #2d3679;
  --color-perrywinkle-900: #222a63;
  --color-perrywinkle-950: #141a44;
  --color-crisps: #ddbb5e;
  --color-crisps-50: #fff3d5;
  --color-crisps-100: #fde8b1;
  --color-crisps-200: #edd391;
  --color-crisps-300: #ddbb5e;
  --color-crisps-400: #bc9c42;
  --color-crisps-500: #a18019;
  --color-crisps-600: #836700;
  --color-crisps-700: #695100;
  --color-crisps-800: #523f00;
  --color-crisps-900: #403100;
  --color-crisps-950: #291e00;
  --color-pitch-black-forests: #12331d;
  --color-pitch-black-forests-50: #e7fceb;
  --color-pitch-black-forests-100: #dbf2e0;
  --color-pitch-black-forests-200: #c4e0ca;
  --color-pitch-black-forests-300: #abcab2;
  --color-pitch-black-forests-400: #87aa90;
  --color-pitch-black-forests-500: #6a8d73;
  --color-pitch-black-forests-600: #4f7158;
  --color-pitch-black-forests-700: #3a5842;
  --color-pitch-black-forests-800: #294330;
  --color-pitch-black-forests-900: #12331d;
  --color-pitch-black-forests-950: #0f1d13;
  --color-twilight-express: #1d3c7a;
  --color-twilight-express-50: #f0f5ff;
  --color-twilight-express-100: #e1ecff;
  --color-twilight-express-200: #c3d8ff;
  --color-twilight-express-300: #9fc1ff;
  --color-twilight-express-400: #7ca0e4;
  --color-twilight-express-500: #5f84c8;
  --color-twilight-express-600: #4668a9;
  --color-twilight-express-700: #33518b;
  --color-twilight-express-800: #1d3c7a;
  --color-twilight-express-900: #192f59;
  --color-twilight-express-950: #0d1c3b;
}