Strawberry Blonde to Arcane Red Color Palette

About this palette

Strawberry Blonde to Arcane Red is a 5-color warm, vintage, monochromatic, gradient palette: #FFDAD9 (Strawberry Blonde), #E8AEAF (Chewing Gum), #A97371 (Equestrienne), #90454B (Silk Satin), #693133 (Arcane Red). It mixes pink, red, brown tones and feels warm overall. The strongest text pairing is #FFDAD9 on #693133 with a contrast ratio of 7.80:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Strawberry Blonde	rgb(255, 218, 217)	hsl(2, 100%, 93%)
Chewing Gum	rgb(232, 174, 175)	hsl(359, 56%, 80%)
Equestrienne	rgb(169, 115, 113)	hsl(2, 25%, 55%)
Silk Satin	rgb(144, 69, 75)	hsl(355, 35%, 42%)
Arcane Red	rgb(105, 49, 51)	hsl(358, 36%, 30%)

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.

Aa7.80:1 Very good#FFDAD9 on #693133
Aa7.80:1 Very good#693133 on #FFDAD9
Aa5.32:1 Good#E8AEAF on #693133
Aa5.32:1 Good#693133 on #E8AEAF
Aa5.19:1 Good#FFDAD9 on #90454B
Aa5.19:1 Good#90454B on #FFDAD9
Aa3.54:1 Poor#E8AEAF on #90454B
Aa3.54:1 Poor#90454B on #E8AEAF

Color blindness preview

CSS variables

/* Strawberry Blonde to Arcane Red — https://swatchly.xyz/palette/ffdad9-e8aeaf-a97371-90454b-693133 */
:root {
  --strawberry-blonde: #ffdad9;
  --chewing-gum: #e8aeaf;
  --equestrienne: #a97371;
  --silk-satin: #90454b;
  --arcane-red: #693133;
}

Tailwind CSS v4

/* Strawberry Blonde to Arcane Red — https://swatchly.xyz/palette/ffdad9-e8aeaf-a97371-90454b-693133 */
@theme {
  --color-strawberry-blonde: #ffdad9;
  --color-strawberry-blonde-50: #ffe9e9;
  --color-strawberry-blonde-100: #ffdad9;
  --color-strawberry-blonde-200: #e6cac9;
  --color-strawberry-blonde-300: #d3b4b3;
  --color-strawberry-blonde-400: #b69594;
  --color-strawberry-blonde-500: #9c7b7a;
  --color-strawberry-blonde-600: #816261;
  --color-strawberry-blonde-700: #694d4d;
  --color-strawberry-blonde-800: #543b3b;
  --color-strawberry-blonde-900: #412d2c;
  --color-strawberry-blonde-950: #2a1b1b;
  --color-chewing-gum: #e8aeaf;
  --color-chewing-gum-50: #fff0f0;
  --color-chewing-gum-100: #ffe2e2;
  --color-chewing-gum-200: #f6c9ca;
  --color-chewing-gum-300: #e8aeaf;
  --color-chewing-gum-400: #c69091;
  --color-chewing-gum-500: #aa7576;
  --color-chewing-gum-600: #8e5b5d;
  --color-chewing-gum-700: #744648;
  --color-chewing-gum-800: #5d3537;
  --color-chewing-gum-900: #492829;
  --color-chewing-gum-950: #2f1718;
  --color-equestrienne: #a97371;
  --color-equestrienne-50: #fff1f0;
  --color-equestrienne-100: #ffe2e1;
  --color-equestrienne-200: #f6c9c7;
  --color-equestrienne-300: #e3b0ae;
  --color-equestrienne-400: #c58f8d;
  --color-equestrienne-500: #a97371;
  --color-equestrienne-600: #8d5a58;
  --color-equestrienne-700: #734544;
  --color-equestrienne-800: #5c3433;
  --color-equestrienne-900: #492726;
  --color-equestrienne-950: #2f1717;
  --color-silk-satin: #90454b;
  --color-silk-satin-50: #fff1f2;
  --color-silk-satin-100: #ffe4e4;
  --color-silk-satin-200: #ffcacc;
  --color-silk-satin-300: #f7afb2;
  --color-silk-satin-400: #dd8e92;
  --color-silk-satin-500: #c37378;
  --color-silk-satin-600: #a85a60;
  --color-silk-satin-700: #90454b;
  --color-silk-satin-800: #733439;
  --color-silk-satin-900: #5b252a;
  --color-silk-satin-950: #3c1519;
  --color-arcane-red: #693133;
  --color-arcane-red-50: #fff1f1;
  --color-arcane-red-100: #ffe4e3;
  --color-arcane-red-200: #fdc9c8;
  --color-arcane-red-300: #ebb0b0;
  --color-arcane-red-400: #ce8f8f;
  --color-arcane-red-500: #b37474;
  --color-arcane-red-600: #965a5b;
  --color-arcane-red-700: #7c4546;
  --color-arcane-red-800: #693133;
  --color-arcane-red-900: #4f2728;
  --color-arcane-red-950: #341717;
}