Maiden’s Blush to Heavenly Sky Color Palette

About this palette

Maiden’s Blush to Heavenly Sky is a 5-color muted, cool, vintage palette: #F3D4B7 (Maiden’s Blush), #75604B (Heavy Brown), #315055 (Nocturne), #73B7C6 (Castaway), #7B8CA9 (Heavenly Sky). It mixes orange, brown, turquoise, blue tones and feels cool overall. The strongest text pairing is #F3D4B7 on #315055 with a contrast ratio of 6.19:1, and 1 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Maiden’s Blush	rgb(243, 212, 183)	hsl(29, 71%, 84%)
Heavy Brown	rgb(117, 96, 75)	hsl(30, 22%, 38%)
Nocturne	rgb(49, 80, 85)	hsl(188, 27%, 26%)
Castaway	rgb(115, 183, 198)	hsl(191, 42%, 61%)
Heavenly Sky	rgb(123, 140, 169)	hsl(218, 21%, 57%)

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.

Aa6.19:1 Good#F3D4B7 on #315055
Aa6.19:1 Good#315055 on #F3D4B7
Aa4.22:1 Poor#F3D4B7 on #75604B
Aa4.22:1 Poor#75604B on #F3D4B7
Aa3.87:1 Poor#315055 on #73B7C6
Aa3.87:1 Poor#73B7C6 on #315055

Color blindness preview

CSS variables

/* Maiden’s Blush to Heavenly Sky — https://swatchly.xyz/palette/f3d4b7-75604b-315055-73b7c6-7b8ca9 */
:root {
  --maiden-s-blush: #f3d4b7;
  --heavy-brown: #75604b;
  --nocturne: #315055;
  --castaway: #73b7c6;
  --heavenly-sky: #7b8ca9;
}

Tailwind CSS v4

/* Maiden’s Blush to Heavenly Sky — https://swatchly.xyz/palette/f3d4b7-75604b-315055-73b7c6-7b8ca9 */
@theme {
  --color-maiden-s-blush: #f3d4b7;
  --color-maiden-s-blush-50: #fff5ec;
  --color-maiden-s-blush-100: #fdead8;
  --color-maiden-s-blush-200: #f3d4b7;
  --color-maiden-s-blush-300: #d8bea6;
  --color-maiden-s-blush-400: #b99d83;
  --color-maiden-s-blush-500: #9e8167;
  --color-maiden-s-blush-600: #82674d;
  --color-maiden-s-blush-700: #685039;
  --color-maiden-s-blush-800: #533e29;
  --color-maiden-s-blush-900: #412f1d;
  --color-maiden-s-blush-950: #291c10;
  --color-heavy-brown: #75604b;
  --color-heavy-brown-50: #fff3e7;
  --color-heavy-brown-100: #f6e7d8;
  --color-heavy-brown-200: #e3d1bf;
  --color-heavy-brown-300: #cdb9a5;
  --color-heavy-brown-400: #ae9882;
  --color-heavy-brown-500: #917b66;
  --color-heavy-brown-600: #75604b;
  --color-heavy-brown-700: #5e4c39;
  --color-heavy-brown-800: #4a3a2b;
  --color-heavy-brown-900: #3a2d1f;
  --color-heavy-brown-950: #251b12;
  --color-nocturne: #315055;
  --color-nocturne-50: #e6f9fd;
  --color-nocturne-100: #daf0f3;
  --color-nocturne-200: #c3dde1;
  --color-nocturne-300: #acc9cd;
  --color-nocturne-400: #8babb0;
  --color-nocturne-500: #719197;
  --color-nocturne-600: #58787d;
  --color-nocturne-700: #446267;
  --color-nocturne-800: #315055;
  --color-nocturne-900: #263d41;
  --color-nocturne-950: #16272a;
  --color-castaway: #73b7c6;
  --color-castaway-50: #edfcff;
  --color-castaway-100: #d5f7ff;
  --color-castaway-200: #b8e7f2;
  --color-castaway-300: #9dd3e0;
  --color-castaway-400: #73b7c6;
  --color-castaway-500: #5699a8;
  --color-castaway-600: #397c8b;
  --color-castaway-700: #226370;
  --color-castaway-800: #114d59;
  --color-castaway-900: #053b45;
  --color-castaway-950: #01242b;
  --color-heavenly-sky: #7b8ca9;
  --color-heavenly-sky-50: #f1f6ff;
  --color-heavenly-sky-100: #e3eeff;
  --color-heavenly-sky-200: #cedbf2;
  --color-heavenly-sky-300: #b6c5df;
  --color-heavenly-sky-400: #96a7c3;
  --color-heavenly-sky-500: #7b8ca9;
  --color-heavenly-sky-600: #60708c;
  --color-heavenly-sky-700: #4a5972;
  --color-heavenly-sky-800: #38455b;
  --color-heavenly-sky-900: #2a3547;
  --color-heavenly-sky-950: #18202d;
}