Sakura to Pitch Black color palette

About this palette

Sakura to Pitch Black is a 4-color muted, warm, vintage, gradient palette: #DEB0B7 (Sakura), #B59699 (Nude Lips), #946471 (Fruit of Passion), #4F3B3E (Pitch Black). It mixes pink, red, gray tones and feels warm overall. The strongest text pairing is #DEB0B7 on #4F3B3E with a contrast ratio of 5.43:1, and 1 of its 6 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Sakurargb(222, 176, 183)hsl(351, 41%, 78%)
Nude Lipsrgb(181, 150, 153)hsl(354, 17%, 65%)
Fruit of Passionrgb(148, 100, 113)hsl(344, 19%, 49%)
Pitch Blackrgb(79, 59, 62)hsl(351, 14%, 27%)

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.43:1 Good#DEB0B7 on #4F3B3E
  • Aa5.43:1 Good#4F3B3E on #DEB0B7
  • Aa3.84:1 Poor#B59699 on #4F3B3E
  • Aa3.84:1 Poor#4F3B3E on #B59699

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Sakura to Pitch Black — https://swatchly.xyz/palette/deb0b7-b59699-946471-4f3b3e */
:root {
  --sakura: #deb0b7;
  --nude-lips: #b59699;
  --fruit-of-passion: #946471;
  --pitch-black: #4f3b3e;
}

Tailwind CSS v4

/* Sakura to Pitch Black — https://swatchly.xyz/palette/deb0b7-b59699-946471-4f3b3e */
@theme {
  --color-sakura: #deb0b7;
  --color-sakura-50: #ffeff1;
  --color-sakura-100: #ffe0e5;
  --color-sakura-200: #eecad0;
  --color-sakura-300: #deb0b7;
  --color-sakura-400: #bd9299;
  --color-sakura-500: #a2777e;
  --color-sakura-600: #865e64;
  --color-sakura-700: #6d494f;
  --color-sakura-800: #57383d;
  --color-sakura-900: #452a2f;
  --color-sakura-950: #2c191c;
  --color-nude-lips: #b59699;
  --color-nude-lips-50: #fff0f1;
  --color-nude-lips-100: #f9e4e6;
  --color-nude-lips-200: #e8cfd1;
  --color-nude-lips-300: #d3b7b9;
  --color-nude-lips-400: #b59699;
  --color-nude-lips-500: #997b7e;
  --color-nude-lips-600: #7e6265;
  --color-nude-lips-700: #664d4f;
  --color-nude-lips-800: #513b3d;
  --color-nude-lips-900: #3f2d2f;
  --color-nude-lips-950: #281b1d;
  --color-fruit-of-passion: #946471;
  --color-fruit-of-passion-50: #fff1f4;
  --color-fruit-of-passion-100: #ffe5eb;
  --color-fruit-of-passion-200: #f6ced8;
  --color-fruit-of-passion-300: #e4b7c3;
  --color-fruit-of-passion-400: #c998a4;
  --color-fruit-of-passion-500: #af7d8a;
  --color-fruit-of-passion-600: #946471;
  --color-fruit-of-passion-700: #794d59;
  --color-fruit-of-passion-800: #603a45;
  --color-fruit-of-passion-900: #4b2b34;
  --color-fruit-of-passion-950: #311920;
  --color-pitch-black: #4f3b3e;
  --color-pitch-black-50: #fff1f3;
  --color-pitch-black-100: #f7e7e9;
  --color-pitch-black-200: #e5d2d5;
  --color-pitch-black-300: #d0bbbd;
  --color-pitch-black-400: #b19a9d;
  --color-pitch-black-500: #967f82;
  --color-pitch-black-600: #7a6468;
  --color-pitch-black-700: #624e51;
  --color-pitch-black-800: #4f3b3e;
  --color-pitch-black-900: #3c2e30;
  --color-pitch-black-950: #261b1d;
}

Similar palettes