Candied Apple to Bruised Plum color palette

B05B7CCandied Apple E5D198Honeycomb Glow 3F4C6DNaval Blue 7FB4B3Summit 3C1A21Bruised Plum

About this palette

Candied Apple to Bruised Plum is a 5-color warm, vintage palette: #B05B7C (Candied Apple), #E5D198 (Honeycomb Glow), #3F4C6D (Naval Blue), #7FB4B3 (Summit), #3C1A21 (Bruised Plum). It mixes red, yellow, blue, turquoise, brown tones and feels warm overall. The strongest text pairing is #E5D198 on #3C1A21 with a contrast ratio of 10.21:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Candied Apple	rgb(176, 91, 124)	hsl(337, 35%, 52%)
Honeycomb Glow	rgb(229, 209, 152)	hsl(44, 60%, 75%)
Naval Blue	rgb(63, 76, 109)	hsl(223, 27%, 34%)
Summit	rgb(127, 180, 179)	hsl(179, 26%, 60%)
Bruised Plum	rgb(60, 26, 33)	hsl(348, 40%, 17%)

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.

Aa10.21:1 Very good#E5D198 on #3C1A21
Aa10.21:1 Very good#3C1A21 on #E5D198
Aa6.67:1 Good#7FB4B3 on #3C1A21
Aa6.67:1 Good#3C1A21 on #7FB4B3
Aa5.64:1 Good#E5D198 on #3F4C6D
Aa5.64:1 Good#3F4C6D on #E5D198
Aa3.68:1 Poor#3F4C6D on #7FB4B3
Aa3.68:1 Poor#7FB4B3 on #3F4C6D

Color blindness preview

CSS variables

/* Candied Apple to Bruised Plum — https://swatchly.xyz/palette/b05b7c-e5d198-3f4c6d-7fb4b3-3c1a21 */
:root {
  --candied-apple: #b05b7c;
  --honeycomb-glow: #e5d198;
  --naval-blue: #3f4c6d;
  --summit: #7fb4b3;
  --bruised-plum: #3c1a21;
}

Tailwind CSS v4

/* Candied Apple to Bruised Plum — https://swatchly.xyz/palette/b05b7c-e5d198-3f4c6d-7fb4b3-3c1a21 */
@theme {
  --color-candied-apple: #b05b7c;
  --color-candied-apple-50: #ffeef3;
  --color-candied-apple-100: #ffdce7;
  --color-candied-apple-200: #ffbbd2;
  --color-candied-apple-300: #ee9dba;
  --color-candied-apple-400: #cf7999;
  --color-candied-apple-500: #b05b7c;
  --color-candied-apple-600: #934464;
  --color-candied-apple-700: #79324f;
  --color-candied-apple-800: #62243e;
  --color-candied-apple-900: #4f1a30;
  --color-candied-apple-950: #340e1e;
  --color-honeycomb-glow: #e5d198;
  --color-honeycomb-glow-50: #fdf1d1;
  --color-honeycomb-glow-100: #f3e6c2;
  --color-honeycomb-glow-200: #e5d198;
  --color-honeycomb-glow-300: #cdbc8b;
  --color-honeycomb-glow-400: #af9d68;
  --color-honeycomb-glow-500: #95824c;
  --color-honeycomb-glow-600: #7b6933;
  --color-honeycomb-glow-700: #635321;
  --color-honeycomb-glow-800: #4f4114;
  --color-honeycomb-glow-900: #3e310a;
  --color-honeycomb-glow-950: #271e03;
  --color-naval-blue: #3f4c6d;
  --color-naval-blue-50: #f1f5ff;
  --color-naval-blue-100: #e3ebff;
  --color-naval-blue-200: #c9d6f3;
  --color-naval-blue-300: #afbddf;
  --color-naval-blue-400: #8d9cc1;
  --color-naval-blue-500: #7180a4;
  --color-naval-blue-600: #566485;
  --color-naval-blue-700: #3f4c6d;
  --color-naval-blue-800: #313b54;
  --color-naval-blue-900: #252d42;
  --color-naval-blue-950: #151b2a;
  --color-summit: #7fb4b3;
  --color-summit-50: #e2fefe;
  --color-summit-100: #d7f6f5;
  --color-summit-200: #bfe5e4;
  --color-summit-300: #a5d1d0;
  --color-summit-400: #7fb4b3;
  --color-summit-500: #639796;
  --color-summit-600: #477a7a;
  --color-summit-700: #326261;
  --color-summit-800: #224c4c;
  --color-summit-900: #163a3a;
  --color-summit-950: #0a2424;
  --color-bruised-plum: #3c1a21;
  --color-bruised-plum-50: #fff1f3;
  --color-bruised-plum-100: #ffe3e7;
  --color-bruised-plum-200: #f0cdd2;
  --color-bruised-plum-300: #ddb5bb;
  --color-bruised-plum-400: #bf959b;
  --color-bruised-plum-500: #a57a81;
  --color-bruised-plum-600: #8a6268;
  --color-bruised-plum-700: #724e54;
  --color-bruised-plum-800: #5e3d43;
  --color-bruised-plum-900: #4c3035;
  --color-bruised-plum-950: #3c1a21;
}