Blushing Rose to Blue Moon Color Palette

About this palette

Blushing Rose to Blue Moon is a 5-color warm, earthy, vintage palette: #DA9E88 (Blushing Rose), #00384C (Sea of Stars), #72432D (Brisket), #F8C6B4 (Taco), #3190AA (Blue Moon). It mixes orange, blue, brown tones and feels warm overall. The strongest text pairing is #00384C on #F8C6B4 with a contrast ratio of 8.22:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Blushing Rose	rgb(218, 158, 136)	hsl(16, 53%, 69%)
Sea of Stars	rgb(0, 56, 76)	hsl(196, 100%, 15%)
Brisket	rgb(114, 67, 45)	hsl(19, 43%, 31%)
Taco	rgb(248, 198, 180)	hsl(16, 83%, 84%)
Blue Moon	rgb(49, 144, 170)	hsl(193, 55%, 43%)

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.

Aa8.22:1 Very good#00384C on #F8C6B4
Aa8.22:1 Very good#F8C6B4 on #00384C
Aa5.53:1 Good#DA9E88 on #00384C
Aa5.53:1 Good#00384C on #DA9E88
Aa5.37:1 Good#72432D on #F8C6B4
Aa5.37:1 Good#F8C6B4 on #72432D
Aa3.61:1 Poor#DA9E88 on #72432D
Aa3.61:1 Poor#72432D on #DA9E88

Color blindness preview

CSS variables

/* Blushing Rose to Blue Moon — https://swatchly.xyz/palette/da9e88-00384c-72432d-f8c6b4-3190aa */
:root {
  --blushing-rose: #da9e88;
  --sea-of-stars: #00384c;
  --brisket: #72432d;
  --taco: #f8c6b4;
  --blue-moon: #3190aa;
}

Tailwind CSS v4

/* Blushing Rose to Blue Moon — https://swatchly.xyz/palette/da9e88-00384c-72432d-f8c6b4-3190aa */
@theme {
  --color-blushing-rose: #da9e88;
  --color-blushing-rose-50: #fff8f5;
  --color-blushing-rose-100: #ffeee8;
  --color-blushing-rose-200: #ffd6c7;
  --color-blushing-rose-300: #f1bfad;
  --color-blushing-rose-400: #da9e88;
  --color-blushing-rose-500: #ba816c;
  --color-blushing-rose-600: #9b6450;
  --color-blushing-rose-700: #7e4c3a;
  --color-blushing-rose-800: #643929;
  --color-blushing-rose-900: #4e291c;
  --color-blushing-rose-950: #31170e;
  --color-sea-of-stars: #00384c;
  --color-sea-of-stars-50: #eaf8ff;
  --color-sea-of-stars-100: #d3f0ff;
  --color-sea-of-stars-200: #b9def1;
  --color-sea-of-stars-300: #9ec8dd;
  --color-sea-of-stars-400: #7aa9c0;
  --color-sea-of-stars-500: #5d8ea5;
  --color-sea-of-stars-600: #437388;
  --color-sea-of-stars-700: #2f5b6f;
  --color-sea-of-stars-800: #204759;
  --color-sea-of-stars-900: #00384c;
  --color-sea-of-stars-950: #0a222d;
  --color-brisket: #72432d;
  --color-brisket-50: #fff2ec;
  --color-brisket-100: #ffe5da;
  --color-brisket-200: #f7ccb9;
  --color-brisket-300: #e3b39e;
  --color-brisket-400: #c5917a;
  --color-brisket-500: #a8755e;
  --color-brisket-600: #8a5a44;
  --color-brisket-700: #72432d;
  --color-brisket-800: #593423;
  --color-brisket-900: #462718;
  --color-brisket-950: #2d170c;
  --color-taco: #f8c6b4;
  --color-taco-50: #ffeee8;
  --color-taco-100: #ffe0d4;
  --color-taco-200: #f8c6b4;
  --color-taco-300: #ddb2a3;
  --color-taco-400: #c09382;
  --color-taco-500: #a57867;
  --color-taco-600: #895f4f;
  --color-taco-700: #704a3c;
  --color-taco-800: #5a392c;
  --color-taco-900: #472b20;
  --color-taco-950: #2e1912;
  --color-blue-moon: #3190aa;
  --color-blue-moon-50: #e5f8ff;
  --color-blue-moon-100: #caf2ff;
  --color-blue-moon-200: #a1e1f6;
  --color-blue-moon-300: #80cce3;
  --color-blue-moon-400: #55acc6;
  --color-blue-moon-500: #3190aa;
  --color-blue-moon-600: #0a758e;
  --color-blue-moon-700: #005d72;
  --color-blue-moon-800: #00495a;
  --color-blue-moon-900: #003846;
  --color-blue-moon-950: #00232d;
}