Pastel Pink to Blue Eye Samurai color palette

DDA8ABPastel Pink 3E2B29Havana D4D8FBIcy Plains 4B4929Jungle King 787099Purple Haze 74AEB1Blue Eye Samurai

Open in generator Export PNG, PDF, ASE…

About this palette

Pastel Pink to Blue Eye Samurai is a 6-color muted palette: #DDA8AB (Pastel Pink), #3E2B29 (Havana), #D4D8FB (Icy Plains), #4B4929 (Jungle King), #787099 (Purple Haze), #74AEB1 (Blue Eye Samurai). It mixes pink, gray, purple, brown, turquoise tones and feels cool overall. The strongest text pairing is #3E2B29 on #D4D8FB with a contrast ratio of 9.49:1, and 4 of its 15 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Pastel Pink	rgb(221, 168, 171)	hsl(357, 44%, 76%)
Havana	rgb(62, 43, 41)	hsl(6, 20%, 20%)
Icy Plains	rgb(212, 216, 251)	hsl(234, 83%, 91%)
Jungle King	rgb(75, 73, 41)	hsl(56, 29%, 23%)
Purple Haze	rgb(120, 112, 153)	hsl(252, 17%, 52%)
Blue Eye Samurai	rgb(116, 174, 177)	hsl(183, 28%, 57%)

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.

Aa9.49:1 Very good#3E2B29 on #D4D8FB
Aa9.49:1 Very good#D4D8FB on #3E2B29
Aa6.57:1 Good#D4D8FB on #4B4929
Aa6.57:1 Good#4B4929 on #D4D8FB
Aa6.49:1 Good#DDA8AB on #3E2B29
Aa6.49:1 Good#3E2B29 on #DDA8AB
Aa5.33:1 Good#3E2B29 on #74AEB1
Aa5.33:1 Good#74AEB1 on #3E2B29

Color blindness preview

CSS variables

/* Pastel Pink to Blue Eye Samurai — https://swatchly.xyz/palette/dda8ab-3e2b29-d4d8fb-4b4929-787099-74aeb1 */
:root {
  --pastel-pink: #dda8ab;
  --havana: #3e2b29;
  --icy-plains: #d4d8fb;
  --jungle-king: #4b4929;
  --purple-haze: #787099;
  --blue-eye-samurai: #74aeb1;
}

Tailwind CSS v4

/* Pastel Pink to Blue Eye Samurai — https://swatchly.xyz/palette/dda8ab-3e2b29-d4d8fb-4b4929-787099-74aeb1 */
@theme {
  --color-pastel-pink: #dda8ab;
  --color-pastel-pink-50: #ffebec;
  --color-pastel-pink-100: #ffdbdc;
  --color-pastel-pink-200: #eec3c5;
  --color-pastel-pink-300: #dda8ab;
  --color-pastel-pink-400: #bd8b8e;
  --color-pastel-pink-500: #a37174;
  --color-pastel-pink-600: #87595c;
  --color-pastel-pink-700: #6f4548;
  --color-pastel-pink-800: #5a3538;
  --color-pastel-pink-900: #48292b;
  --color-pastel-pink-950: #2e181a;
  --color-havana: #3e2b29;
  --color-havana-50: #fff2f0;
  --color-havana-100: #f7e7e5;
  --color-havana-200: #e5d2d0;
  --color-havana-300: #d0bbb9;
  --color-havana-400: #b29b98;
  --color-havana-500: #967f7c;
  --color-havana-600: #7a6562;
  --color-havana-700: #624e4c;
  --color-havana-800: #4c3c3a;
  --color-havana-900: #3e2b29;
  --color-havana-950: #251b1a;
  --color-icy-plains: #d4d8fb;
  --color-icy-plains-50: #f6f7ff;
  --color-icy-plains-100: #eaedff;
  --color-icy-plains-200: #d4d8fb;
  --color-icy-plains-300: #bec1de;
  --color-icy-plains-400: #9da1c1;
  --color-icy-plains-500: #8285a5;
  --color-icy-plains-600: #676a88;
  --color-icy-plains-700: #51536f;
  --color-icy-plains-800: #3e4058;
  --color-icy-plains-900: #2f3145;
  --color-icy-plains-950: #1d1e2c;
  --color-jungle-king: #4b4929;
  --color-jungle-king-50: #f7f7e2;
  --color-jungle-king-100: #eeedd6;
  --color-jungle-king-200: #dad9be;
  --color-jungle-king-300: #c5c4a5;
  --color-jungle-king-400: #a7a684;
  --color-jungle-king-500: #8d8b69;
  --color-jungle-king-600: #737150;
  --color-jungle-king-700: #5d5b3d;
  --color-jungle-king-800: #4b4929;
  --color-jungle-king-900: #393821;
  --color-jungle-king-950: #242312;
  --color-purple-haze: #787099;
  --color-purple-haze-50: #f5f3ff;
  --color-purple-haze-100: #eeeaff;
  --color-purple-haze-200: #dcd7f8;
  --color-purple-haze-300: #c8c1e7;
  --color-purple-haze-400: #aaa3cc;
  --color-purple-haze-500: #9189b3;
  --color-purple-haze-600: #787099;
  --color-purple-haze-700: #5f587d;
  --color-purple-haze-800: #4a4364;
  --color-purple-haze-900: #39334f;
  --color-purple-haze-950: #231f33;
  --color-blue-eye-samurai: #74aeb1;
  --color-blue-eye-samurai-50: #ddfdfe;
  --color-blue-eye-samurai-100: #d0f4f5;
  --color-blue-eye-samurai-200: #b7e1e3;
  --color-blue-eye-samurai-300: #9bcccf;
  --color-blue-eye-samurai-400: #74aeb1;
  --color-blue-eye-samurai-500: #599295;
  --color-blue-eye-samurai-600: #3f777a;
  --color-blue-eye-samurai-700: #2a5f62;
  --color-blue-eye-samurai-800: #1b4b4d;
  --color-blue-eye-samurai-900: #113a3c;
  --color-blue-eye-samurai-950: #072426;
}