Galaxy Express to Matt Purple Color Palette

About this palette

Galaxy Express to Matt Purple is a 5-color cool palette: #463DAD (Galaxy Express), #00CAA8 (Turquoise), #FFE8DF (Dogwood), #4D2210 (Chocolate Rush), #8B76DA (Matt Purple). It mixes purple, turquoise, white, brown tones and feels cool overall. The strongest text pairing is #FFE8DF on #4D2210 with a contrast ratio of 11.51:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Galaxy Express	rgb(70, 61, 173)	hsl(245, 48%, 46%)
Turquoise	rgb(0, 202, 168)	hsl(170, 100%, 40%)
Dogwood	rgb(255, 232, 223)	hsl(17, 100%, 94%)
Chocolate Rush	rgb(77, 34, 16)	hsl(18, 66%, 18%)
Matt Purple	rgb(139, 118, 218)	hsl(253, 57%, 66%)

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.

Aa11.51:1 Very good#FFE8DF on #4D2210
Aa11.51:1 Very good#4D2210 on #FFE8DF
Aa7.06:1 Very good#463DAD on #FFE8DF
Aa7.06:1 Very good#FFE8DF on #463DAD
Aa6.45:1 Good#00CAA8 on #4D2210
Aa6.45:1 Good#4D2210 on #00CAA8
Aa3.96:1 Poor#463DAD on #00CAA8
Aa3.96:1 Poor#00CAA8 on #463DAD

Color blindness preview

CSS variables

/* Galaxy Express to Matt Purple — https://swatchly.xyz/palette/463dad-00caa8-ffe8df-4d2210-8b76da */
:root {
  --galaxy-express: #463dad;
  --turquoise: #00caa8;
  --dogwood: #ffe8df;
  --chocolate-rush: #4d2210;
  --matt-purple: #8b76da;
}

Tailwind CSS v4

/* Galaxy Express to Matt Purple — https://swatchly.xyz/palette/463dad-00caa8-ffe8df-4d2210-8b76da */
@theme {
  --color-galaxy-express: #463dad;
  --color-galaxy-express-50: #f3f4ff;
  --color-galaxy-express-100: #e7eaff;
  --color-galaxy-express-200: #cfd3ff;
  --color-galaxy-express-300: #b3b9ff;
  --color-galaxy-express-400: #8f92ff;
  --color-galaxy-express-500: #7373e8;
  --color-galaxy-express-600: #5b57c6;
  --color-galaxy-express-700: #463dad;
  --color-galaxy-express-800: #362f88;
  --color-galaxy-express-900: #29226e;
  --color-galaxy-express-950: #181349;
  --color-turquoise: #00caa8;
  --color-turquoise-50: #eafff8;
  --color-turquoise-100: #caffef;
  --color-turquoise-200: #97f6dc;
  --color-turquoise-300: #70e4c7;
  --color-turquoise-400: #00caa8;
  --color-turquoise-500: #00a88b;
  --color-turquoise-600: #00876f;
  --color-turquoise-700: #006a58;
  --color-turquoise-800: #005243;
  --color-turquoise-900: #003f32;
  --color-turquoise-950: #00261e;
  --color-dogwood: #ffe8df;
  --color-dogwood-50: #fff5f1;
  --color-dogwood-100: #ffe8df;
  --color-dogwood-200: #e6d5cf;
  --color-dogwood-300: #d1beb7;
  --color-dogwood-400: #b29e96;
  --color-dogwood-500: #96827a;
  --color-dogwood-600: #7b6760;
  --color-dogwood-700: #62514a;
  --color-dogwood-800: #4e3f39;
  --color-dogwood-900: #3c302b;
  --color-dogwood-950: #261d19;
  --color-chocolate-rush: #4d2210;
  --color-chocolate-rush-50: #fff2ed;
  --color-chocolate-rush-100: #ffe5db;
  --color-chocolate-rush-200: #f7cdbd;
  --color-chocolate-rush-300: #e4b5a2;
  --color-chocolate-rush-400: #c6937f;
  --color-chocolate-rush-500: #aa7763;
  --color-chocolate-rush-600: #8d5d4a;
  --color-chocolate-rush-700: #724736;
  --color-chocolate-rush-800: #5a3526;
  --color-chocolate-rush-900: #4d2210;
  --color-chocolate-rush-950: #2c170e;
  --color-matt-purple: #8b76da;
  --color-matt-purple-50: #f5f4ff;
  --color-matt-purple-100: #ece9ff;
  --color-matt-purple-200: #d9d3ff;
  --color-matt-purple-300: #c3b8ff;
  --color-matt-purple-400: #a593f4;
  --color-matt-purple-500: #8b76da;
  --color-matt-purple-600: #715bbb;
  --color-matt-purple-700: #5a449c;
  --color-matt-purple-800: #46327f;
  --color-matt-purple-900: #362566;
  --color-matt-purple-950: #211544;
}