Macau to Purple Velour Color Palette

About this palette

Macau to Purple Velour is a 5-color warm palette: #39C094 (Macau), #FFC87B (Liquid Gold), #2D1523 (Black Cherry), #417CB9 (Mykonos), #621D4F (Purple Velour). It mixes turquoise, orange, red, blue tones and feels warm overall. The strongest text pairing is #FFC87B on #2D1523 with a contrast ratio of 11.10:1, and 4 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Macau	rgb(57, 192, 148)	hsl(160, 54%, 49%)
Liquid Gold	rgb(255, 200, 123)	hsl(35, 100%, 74%)
Black Cherry	rgb(45, 21, 35)	hsl(325, 36%, 13%)
Mykonos	rgb(65, 124, 185)	hsl(210, 48%, 49%)
Purple Velour	rgb(98, 29, 79)	hsl(317, 54%, 25%)

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.10:1 Very good#FFC87B on #2D1523
Aa11.10:1 Very good#2D1523 on #FFC87B
Aa7.63:1 Very good#FFC87B on #621D4F
Aa7.63:1 Very good#621D4F on #FFC87B
Aa7.35:1 Very good#39C094 on #2D1523
Aa7.35:1 Very good#2D1523 on #39C094
Aa5.06:1 Good#39C094 on #621D4F
Aa5.06:1 Good#621D4F on #39C094

Color blindness preview

CSS variables

/* Macau to Purple Velour — https://swatchly.xyz/palette/39c094-ffc87b-2d1523-417cb9-621d4f */
:root {
  --macau: #39c094;
  --liquid-gold: #ffc87b;
  --black-cherry: #2d1523;
  --mykonos: #417cb9;
  --purple-velour: #621d4f;
}

Tailwind CSS v4

/* Macau to Purple Velour — https://swatchly.xyz/palette/39c094-ffc87b-2d1523-417cb9-621d4f */
@theme {
  --color-macau: #39c094;
  --color-macau-50: #e1fff2;
  --color-macau-100: #bcffe2;
  --color-macau-200: #9befcd;
  --color-macau-300: #77dcb5;
  --color-macau-400: #39c094;
  --color-macau-500: #00a279;
  --color-macau-600: #008360;
  --color-macau-700: #00684c;
  --color-macau-800: #00513a;
  --color-macau-900: #003e2c;
  --color-macau-950: #00271a;
  --color-liquid-gold: #ffc87b;
  --color-liquid-gold-50: #ffefdb;
  --color-liquid-gold-100: #ffe2bd;
  --color-liquid-gold-200: #ffc87b;
  --color-liquid-gold-300: #e3b473;
  --color-liquid-gold-400: #c7944a;
  --color-liquid-gold-500: #ac7928;
  --color-liquid-gold-600: #8f5f00;
  --color-liquid-gold-700: #734b00;
  --color-liquid-gold-800: #5b3b00;
  --color-liquid-gold-900: #472d00;
  --color-liquid-gold-950: #2d1b00;
  --color-black-cherry: #2d1523;
  --color-black-cherry-50: #fff0f8;
  --color-black-cherry-100: #fae4ef;
  --color-black-cherry-200: #e9cfdc;
  --color-black-cherry-300: #d4b8c6;
  --color-black-cherry-400: #b697a8;
  --color-black-cherry-500: #9a7b8c;
  --color-black-cherry-600: #7f6171;
  --color-black-cherry-700: #664c5a;
  --color-black-cherry-800: #503a46;
  --color-black-cherry-900: #3e2b36;
  --color-black-cherry-950: #2d1523;
  --color-mykonos: #417cb9;
  --color-mykonos-50: #eef6ff;
  --color-mykonos-100: #e1efff;
  --color-mykonos-200: #c3e0ff;
  --color-mykonos-300: #9ecdff;
  --color-mykonos-400: #77afeb;
  --color-mykonos-500: #5b95d3;
  --color-mykonos-600: #417cb9;
  --color-mykonos-700: #2a629a;
  --color-mykonos-800: #194c7e;
  --color-mykonos-900: #0c3a64;
  --color-mykonos-950: #032442;
  --color-purple-velour: #621d4f;
  --color-purple-velour-50: #fff0f9;
  --color-purple-velour-100: #ffe1f4;
  --color-purple-velour-200: #ffc2e9;
  --color-purple-velour-300: #eca6d4;
  --color-purple-velour-400: #ce83b5;
  --color-purple-velour-500: #b16598;
  --color-purple-velour-600: #924b7c;
  --color-purple-velour-700: #753662;
  --color-purple-velour-800: #621d4f;
  --color-purple-velour-900: #481b3b;
  --color-purple-velour-950: #2e0e25;
}