Dried Tomatoes to Noble Knight Color Palette

About this palette

Dried Tomatoes to Noble Knight is a 5-color warm, vintage palette: #AA5D62 (Dried Tomatoes), #EEC3C7 (Berry Good), #287E7E (Jade Jewel), #B7A668 (Windy Meadow), #484874 (Noble Knight). It mixes red, pink, turquoise, yellow, purple tones and feels warm overall. The strongest text pairing is #EEC3C7 on #484874 with a contrast ratio of 5.40:1, and 1 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Dried Tomatoes	rgb(170, 93, 98)	hsl(356, 31%, 52%)
Berry Good	rgb(238, 195, 199)	hsl(354, 56%, 85%)
Jade Jewel	rgb(40, 126, 126)	hsl(180, 52%, 33%)
Windy Meadow	rgb(183, 166, 104)	hsl(47, 35%, 56%)
Noble Knight	rgb(72, 72, 116)	hsl(240, 23%, 37%)

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.

Aa5.40:1 Good#EEC3C7 on #484874
Aa5.40:1 Good#484874 on #EEC3C7
Aa3.53:1 Poor#B7A668 on #484874
Aa3.53:1 Poor#484874 on #B7A668
Aa3.03:1 Poor#EEC3C7 on #287E7E
Aa3.03:1 Poor#287E7E on #EEC3C7

Color blindness preview

CSS variables

/* Dried Tomatoes to Noble Knight — https://swatchly.xyz/palette/aa5d62-eec3c7-287e7e-b7a668-484874 */
:root {
  --dried-tomatoes: #aa5d62;
  --berry-good: #eec3c7;
  --jade-jewel: #287e7e;
  --windy-meadow: #b7a668;
  --noble-knight: #484874;
}

Tailwind CSS v4

/* Dried Tomatoes to Noble Knight — https://swatchly.xyz/palette/aa5d62-eec3c7-287e7e-b7a668-484874 */
@theme {
  --color-dried-tomatoes: #aa5d62;
  --color-dried-tomatoes-50: #fff1f2;
  --color-dried-tomatoes-100: #ffe7e7;
  --color-dried-tomatoes-200: #ffcdcf;
  --color-dried-tomatoes-300: #f8b2b4;
  --color-dried-tomatoes-400: #df9195;
  --color-dried-tomatoes-500: #c5767a;
  --color-dried-tomatoes-600: #aa5d62;
  --color-dried-tomatoes-700: #8c464b;
  --color-dried-tomatoes-800: #713338;
  --color-dried-tomatoes-900: #592529;
  --color-dried-tomatoes-950: #3a1418;
  --color-berry-good: #eec3c7;
  --color-berry-good-50: #ffeaeb;
  --color-berry-good-100: #f9dcdf;
  --color-berry-good-200: #eec3c7;
  --color-berry-good-300: #d5b0b3;
  --color-berry-good-400: #b89195;
  --color-berry-good-500: #9e777b;
  --color-berry-good-600: #835e62;
  --color-berry-good-700: #6b4a4d;
  --color-berry-good-800: #56393c;
  --color-berry-good-900: #432b2e;
  --color-berry-good-950: #2b1a1c;
  --color-jade-jewel: #287e7e;
  --color-jade-jewel-50: #d4fffe;
  --color-jade-jewel-100: #c7f7f6;
  --color-jade-jewel-200: #ace6e5;
  --color-jade-jewel-300: #8ed1d0;
  --color-jade-jewel-400: #67b3b3;
  --color-jade-jewel-500: #479998;
  --color-jade-jewel-600: #287e7e;
  --color-jade-jewel-700: #0f6565;
  --color-jade-jewel-800: #005050;
  --color-jade-jewel-900: #003d3d;
  --color-jade-jewel-950: #002626;
  --color-windy-meadow: #b7a668;
  --color-windy-meadow-50: #fff7da;
  --color-windy-meadow-100: #f8eec8;
  --color-windy-meadow-200: #e7dbae;
  --color-windy-meadow-300: #d3c591;
  --color-windy-meadow-400: #b7a668;
  --color-windy-meadow-500: #9a8a4c;
  --color-windy-meadow-600: #7e6e31;
  --color-windy-meadow-700: #65571d;
  --color-windy-meadow-800: #50430e;
  --color-windy-meadow-900: #3e3305;
  --color-windy-meadow-950: #271f01;
  --color-noble-knight: #484874;
  --color-noble-knight-50: #f3f4ff;
  --color-noble-knight-100: #e8e9ff;
  --color-noble-knight-200: #d0d2fa;
  --color-noble-knight-300: #b7b9e6;
  --color-noble-knight-400: #9698c8;
  --color-noble-knight-500: #7a7bab;
  --color-noble-knight-600: #5f608c;
  --color-noble-knight-700: #484874;
  --color-noble-knight-800: #38385a;
  --color-noble-knight-900: #2a2b47;
  --color-noble-knight-950: #19192e;
}