Strawberry Blonde to Vaporised Color Palette

About this palette

Strawberry Blonde to Vaporised is a 4-color pastel, light palette: #FFDBDB (Strawberry Blonde), #ACD3F6 (Andromeda Blue), #E2D39C (Woven), #C8F5FF (Vaporised). It mixes pink, blue, yellow, white tones and feels balanced overall. The strongest text pairing is #ACD3F6 on #C8F5FF with a contrast ratio of 1.34:1, and 0 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Strawberry Blonde	rgb(255, 219, 219)	hsl(0, 100%, 93%)
Andromeda Blue	rgb(172, 211, 246)	hsl(208, 80%, 82%)
Woven	rgb(226, 211, 156)	hsl(47, 55%, 75%)
Vaporised	rgb(200, 245, 255)	hsl(191, 100%, 89%)

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.

Color blindness preview

CSS variables

/* Strawberry Blonde to Vaporised — https://swatchly.xyz/palette/ffdbdb-acd3f6-e2d39c-c8f5ff */
:root {
  --strawberry-blonde: #ffdbdb;
  --andromeda-blue: #acd3f6;
  --woven: #e2d39c;
  --vaporised: #c8f5ff;
}

Tailwind CSS v4

/* Strawberry Blonde to Vaporised — https://swatchly.xyz/palette/ffdbdb-acd3f6-e2d39c-c8f5ff */
@theme {
  --color-strawberry-blonde: #ffdbdb;
  --color-strawberry-blonde-50: #ffeaea;
  --color-strawberry-blonde-100: #ffdbdb;
  --color-strawberry-blonde-200: #e6cbcb;
  --color-strawberry-blonde-300: #d3b4b4;
  --color-strawberry-blonde-400: #b69596;
  --color-strawberry-blonde-500: #9b7b7b;
  --color-strawberry-blonde-600: #806262;
  --color-strawberry-blonde-700: #694d4d;
  --color-strawberry-blonde-800: #533b3c;
  --color-strawberry-blonde-900: #412d2d;
  --color-strawberry-blonde-950: #291b1b;
  --color-andromeda-blue: #acd3f6;
  --color-andromeda-blue-50: #e1f1ff;
  --color-andromeda-blue-100: #cce7ff;
  --color-andromeda-blue-200: #acd3f6;
  --color-andromeda-blue-300: #9cbedc;
  --color-andromeda-blue-400: #7ca0c0;
  --color-andromeda-blue-500: #6286a6;
  --color-andromeda-blue-600: #4a6d8b;
  --color-andromeda-blue-700: #375773;
  --color-andromeda-blue-800: #29455d;
  --color-andromeda-blue-900: #1d354a;
  --color-andromeda-blue-950: #102130;
  --color-woven: #e2d39c;
  --color-woven-50: #fbf2d3;
  --color-woven-100: #f1e8c4;
  --color-woven-200: #e2d39c;
  --color-woven-300: #cabd8f;
  --color-woven-400: #ac9e6b;
  --color-woven-500: #92844f;
  --color-woven-600: #786a37;
  --color-woven-700: #615425;
  --color-woven-800: #4d4217;
  --color-woven-900: #3c320e;
  --color-woven-950: #261f05;
  --color-vaporised: #c8f5ff;
  --color-vaporised-50: #e5faff;
  --color-vaporised-100: #c8f5ff;
  --color-vaporised-200: #bedfe6;
  --color-vaporised-300: #a4c9d1;
  --color-vaporised-400: #81aab3;
  --color-vaporised-500: #648e98;
  --color-vaporised-600: #4b737c;
  --color-vaporised-700: #375c64;
  --color-vaporised-800: #27484f;
  --color-vaporised-900: #1c383e;
  --color-vaporised-950: #0e2327;
}