Black Cherry to Peach Fuzz color palette

281627Black Cherry 623444Siren 734E5DHibernation B86B5AClay B98FBCLa la Love FFC2BAPeach Fuzz

About this palette

Black Cherry to Peach Fuzz is a 6-color warm, vintage, gradient palette: #281627 (Black Cherry), #623444 (Siren), #734E5D (Hibernation), #B86B5A (Clay), #B98FBC (La la Love), #FFC2BA (Peach Fuzz). It mixes purple, red, pink tones and feels warm overall. The strongest text pairing is #281627 on #FFC2BA with a contrast ratio of 11.08:1, and 4 of its 15 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Black Cherry	rgb(40, 22, 39)	hsl(303, 29%, 12%)
Siren	rgb(98, 52, 68)	hsl(339, 31%, 29%)
Hibernation	rgb(115, 78, 93)	hsl(336, 19%, 38%)
Clay	rgb(184, 107, 90)	hsl(11, 40%, 54%)
La la Love	rgb(185, 143, 188)	hsl(296, 25%, 65%)
Peach Fuzz	rgb(255, 194, 186)	hsl(7, 100%, 86%)

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.

Aa11.08:1 Very good#281627 on #FFC2BA
Aa11.08:1 Very good#FFC2BA on #281627
Aa6.53:1 Good#623444 on #FFC2BA
Aa6.53:1 Good#FFC2BA on #623444
Aa6.25:1 Good#281627 on #B98FBC
Aa6.25:1 Good#B98FBC on #281627
Aa4.59:1 Good#734E5D on #FFC2BA
Aa4.59:1 Good#FFC2BA on #734E5D

Color blindness preview

CSS variables

/* Black Cherry to Peach Fuzz — https://swatchly.xyz/palette/281627-623444-734e5d-b86b5a-b98fbc-ffc2ba */
:root {
  --black-cherry: #281627;
  --siren: #623444;
  --hibernation: #734e5d;
  --clay: #b86b5a;
  --la-la-love: #b98fbc;
  --peach-fuzz: #ffc2ba;
}

Tailwind CSS v4

/* Black Cherry to Peach Fuzz — https://swatchly.xyz/palette/281627-623444-734e5d-b86b5a-b98fbc-ffc2ba */
@theme {
  --color-black-cherry: #281627;
  --color-black-cherry-50: #fef0fd;
  --color-black-cherry-100: #f5e5f4;
  --color-black-cherry-200: #e3d1e2;
  --color-black-cherry-300: #ceb9cc;
  --color-black-cherry-400: #b099ae;
  --color-black-cherry-500: #947d92;
  --color-black-cherry-600: #796377;
  --color-black-cherry-700: #604d5f;
  --color-black-cherry-800: #4b3b4a;
  --color-black-cherry-900: #3a2c39;
  --color-black-cherry-950: #281627;
  --color-siren: #623444;
  --color-siren-50: #fff1f5;
  --color-siren-100: #ffe3eb;
  --color-siren-200: #f5cad7;
  --color-siren-300: #e2b2c1;
  --color-siren-400: #c692a2;
  --color-siren-500: #aa7687;
  --color-siren-600: #8e5d6d;
  --color-siren-700: #754857;
  --color-siren-800: #623444;
  --color-siren-900: #4a2934;
  --color-siren-950: #301820;
  --color-hibernation: #734e5d;
  --color-hibernation-50: #fff1f6;
  --color-hibernation-100: #fee2ed;
  --color-hibernation-200: #efcedb;
  --color-hibernation-300: #dcb7c5;
  --color-hibernation-400: #bf98a7;
  --color-hibernation-500: #a57d8d;
  --color-hibernation-600: #8a6473;
  --color-hibernation-700: #734e5d;
  --color-hibernation-800: #5b3c49;
  --color-hibernation-900: #472d38;
  --color-hibernation-950: #2e1b23;
  --color-clay: #b86b5a;
  --color-clay-50: #fff1ee;
  --color-clay-100: #ffe3dc;
  --color-clay-200: #ffc6b9;
  --color-clay-300: #f2aa9a;
  --color-clay-400: #d58876;
  --color-clay-500: #b86b5a;
  --color-clay-600: #9a5242;
  --color-clay-700: #7f3d2f;
  --color-clay-800: #662d21;
  --color-clay-900: #512117;
  --color-clay-950: #35130b;
  --color-la-la-love: #b98fbc;
  --color-la-la-love-50: #feefff;
  --color-la-la-love-100: #fce0fd;
  --color-la-la-love-200: #ebcaed;
  --color-la-la-love-300: #d6b1d9;
  --color-la-la-love-400: #b98fbc;
  --color-la-la-love-500: #9d74a0;
  --color-la-la-love-600: #815b84;
  --color-la-la-love-700: #69466b;
  --color-la-la-love-800: #533556;
  --color-la-la-love-900: #412843;
  --color-la-la-love-950: #2a172b;
  --color-peach-fuzz: #ffc2ba;
  --color-peach-fuzz-50: #ffeeeb;
  --color-peach-fuzz-100: #ffdfdb;
  --color-peach-fuzz-200: #ffc2ba;
  --color-peach-fuzz-300: #e3afa8;
  --color-peach-fuzz-400: #c68f88;
  --color-peach-fuzz-500: #ab746d;
  --color-peach-fuzz-600: #8f5b54;
  --color-peach-fuzz-700: #754641;
  --color-peach-fuzz-800: #5e3531;
  --color-peach-fuzz-900: #4a2824;
  --color-peach-fuzz-950: #301714;
}