Night Market to Plum Intended color palette

4E6479Night Market C4DDEDPut on Ice A9848EPunched Pink B7BC9FMeadow Morn 5C424APlum Intended

About this palette

Night Market to Plum Intended is a 5-color muted, vintage palette: #4E6479 (Night Market), #C4DDED (Put on Ice), #A9848E (Punched Pink), #B7BC9F (Meadow Morn), #5C424A (Plum Intended). It mixes blue, gray, pink, green, red tones and feels balanced overall. The strongest text pairing is #C4DDED on #5C424A with a contrast ratio of 6.39:1, and 2 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Night Market	rgb(78, 100, 121)	hsl(209, 22%, 39%)
Put on Ice	rgb(196, 221, 237)	hsl(203, 53%, 85%)
Punched Pink	rgb(169, 132, 142)	hsl(344, 18%, 59%)
Meadow Morn	rgb(183, 188, 159)	hsl(70, 18%, 68%)
Plum Intended	rgb(92, 66, 74)	hsl(342, 16%, 31%)

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.39:1 Good#C4DDED on #5C424A
Aa6.39:1 Good#5C424A on #C4DDED
Aa4.59:1 Good#B7BC9F on #5C424A
Aa4.59:1 Good#5C424A on #B7BC9F
Aa4.36:1 Poor#4E6479 on #C4DDED
Aa4.36:1 Poor#C4DDED on #4E6479
Aa3.13:1 Poor#4E6479 on #B7BC9F
Aa3.13:1 Poor#B7BC9F on #4E6479

Color blindness preview

CSS variables

/* Night Market to Plum Intended — https://swatchly.xyz/palette/4e6479-c4dded-a9848e-b7bc9f-5c424a */
:root {
  --night-market: #4e6479;
  --put-on-ice: #c4dded;
  --punched-pink: #a9848e;
  --meadow-morn: #b7bc9f;
  --plum-intended: #5c424a;
}

Tailwind CSS v4

/* Night Market to Plum Intended — https://swatchly.xyz/palette/4e6479-c4dded-a9848e-b7bc9f-5c424a */
@theme {
  --color-night-market: #4e6479;
  --color-night-market-50: #edf6ff;
  --color-night-market-100: #dbebfb;
  --color-night-market-200: #c3d6e9;
  --color-night-market-300: #a9bed3;
  --color-night-market-400: #869db3;
  --color-night-market-500: #698096;
  --color-night-market-600: #4e6479;
  --color-night-market-700: #3c4f61;
  --color-night-market-800: #2d3e4d;
  --color-night-market-900: #22303d;
  --color-night-market-950: #141d27;
  --color-put-on-ice: #c4dded;
  --color-put-on-ice-50: #edf8ff;
  --color-put-on-ice-100: #e0eff9;
  --color-put-on-ice-200: #c4dded;
  --color-put-on-ice-300: #b1c5d3;
  --color-put-on-ice-400: #8fa6b5;
  --color-put-on-ice-500: #738a99;
  --color-put-on-ice-600: #5a707e;
  --color-put-on-ice-700: #455965;
  --color-put-on-ice-800: #344550;
  --color-put-on-ice-900: #26353e;
  --color-put-on-ice-950: #162127;
  --color-punched-pink: #a9848e;
  --color-punched-pink-50: #fff3f6;
  --color-punched-pink-100: #ffe8ee;
  --color-punched-pink-200: #f1d4db;
  --color-punched-pink-300: #debec6;
  --color-punched-pink-400: #c39fa8;
  --color-punched-pink-500: #a9848e;
  --color-punched-pink-600: #8b6872;
  --color-punched-pink-700: #71515a;
  --color-punched-pink-800: #593d45;
  --color-punched-pink-900: #452e34;
  --color-punched-pink-950: #2c1b20;
  --color-meadow-morn: #b7bc9f;
  --color-meadow-morn-50: #f0f3e1;
  --color-meadow-morn-100: #e4e8d4;
  --color-meadow-morn-200: #cfd3bc;
  --color-meadow-morn-300: #b7bc9f;
  --color-meadow-morn-400: #999e83;
  --color-meadow-morn-500: #808469;
  --color-meadow-morn-600: #676b51;
  --color-meadow-morn-700: #52563e;
  --color-meadow-morn-800: #40442f;
  --color-meadow-morn-900: #323523;
  --color-meadow-morn-950: #1f2114;
  --color-plum-intended: #5c424a;
  --color-plum-intended-50: #fff1f5;
  --color-plum-intended-100: #f9e5eb;
  --color-plum-intended-200: #e8d0d7;
  --color-plum-intended-300: #d5bac2;
  --color-plum-intended-400: #b99ca4;
  --color-plum-intended-500: #9f828a;
  --color-plum-intended-600: #856971;
  --color-plum-intended-700: #6e545c;
  --color-plum-intended-800: #5c424a;
  --color-plum-intended-900: #473339;
  --color-plum-intended-950: #2e1f24;
}