Pinking. Fast and Slow to Treetop Cathedral color palette

E57A9EPinking. Fast and Slow 3E7C9DCry Me a River 6F4559Wine Stain 97C1DFDouble Denim 304500Treetop Cathedral

Open in generator Export PNG, PDF, ASE…

About this palette

Pinking. Fast and Slow to Treetop Cathedral is a 5-color cool, vintage palette: #E57A9E (Pinking. Fast and Slow), #3E7C9D (Cry Me a River), #6F4559 (Wine Stain), #97C1DF (Double Denim), #304500 (Treetop Cathedral). It mixes pink, blue, red, green tones and feels cool overall. The strongest text pairing is #97C1DF on #304500 with a contrast ratio of 5.57:1, and 1 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Pinking. Fast and Slow	rgb(229, 122, 158)	hsl(340, 67%, 69%)
Cry Me a River	rgb(62, 124, 157)	hsl(201, 43%, 43%)
Wine Stain	rgb(111, 69, 89)	hsl(331, 23%, 35%)
Double Denim	rgb(151, 193, 223)	hsl(205, 53%, 73%)
Treetop Cathedral	rgb(48, 69, 0)	hsl(78, 100%, 14%)

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.57:1 Good#97C1DF on #304500
Aa5.57:1 Good#304500 on #97C1DF
Aa4.12:1 Poor#6F4559 on #97C1DF
Aa4.12:1 Poor#97C1DF on #6F4559
Aa3.85:1 Poor#E57A9E on #304500
Aa3.85:1 Poor#304500 on #E57A9E

Color blindness preview

CSS variables

/* Pinking. Fast and Slow to Treetop Cathedral — https://swatchly.xyz/palette/e57a9e-3e7c9d-6f4559-97c1df-304500 */
:root {
  --pinking-fast-and-slow: #e57a9e;
  --cry-me-a-river: #3e7c9d;
  --wine-stain: #6f4559;
  --double-denim: #97c1df;
  --treetop-cathedral: #304500;
}

Tailwind CSS v4

/* Pinking. Fast and Slow to Treetop Cathedral — https://swatchly.xyz/palette/e57a9e-3e7c9d-6f4559-97c1df-304500 */
@theme {
  --color-pinking-fast-and-slow: #e57a9e;
  --color-pinking-fast-and-slow-50: #fff1f4;
  --color-pinking-fast-and-slow-100: #ffe2ea;
  --color-pinking-fast-and-slow-200: #ffc5d5;
  --color-pinking-fast-and-slow-300: #ffa0be;
  --color-pinking-fast-and-slow-400: #e57a9e;
  --color-pinking-fast-and-slow-500: #c65f83;
  --color-pinking-fast-and-slow-600: #a74469;
  --color-pinking-fast-and-slow-700: #8a3052;
  --color-pinking-fast-and-slow-800: #702040;
  --color-pinking-fast-and-slow-900: #591531;
  --color-pinking-fast-and-slow-950: #3a091e;
  --color-cry-me-a-river: #3e7c9d;
  --color-cry-me-a-river-50: #ebf7ff;
  --color-cry-me-a-river-100: #d9f1ff;
  --color-cry-me-a-river-200: #b5e2fc;
  --color-cry-me-a-river-300: #9aceec;
  --color-cry-me-a-river-400: #76b0d1;
  --color-cry-me-a-river-500: #5896b8;
  --color-cry-me-a-river-600: #3e7c9d;
  --color-cry-me-a-river-700: #286381;
  --color-cry-me-a-river-800: #174d68;
  --color-cry-me-a-river-900: #0b3b52;
  --color-cry-me-a-river-950: #032535;
  --color-wine-stain: #6f4559;
  --color-wine-stain-50: #fff1f7;
  --color-wine-stain-100: #ffe2ee;
  --color-wine-stain-200: #f1cbdc;
  --color-wine-stain-300: #ddb3c5;
  --color-wine-stain-400: #bf91a6;
  --color-wine-stain-500: #a3768b;
  --color-wine-stain-600: #875c70;
  --color-wine-stain-700: #6f4559;
  --color-wine-stain-800: #573545;
  --color-wine-stain-900: #442835;
  --color-wine-stain-950: #2c1721;
  --color-double-denim: #97c1df;
  --color-double-denim-50: #e6f4ff;
  --color-double-denim-100: #d0ebff;
  --color-double-denim-200: #b7d7ef;
  --color-double-denim-300: #97c1df;
  --color-double-denim-400: #7ba2be;
  --color-double-denim-500: #6088a4;
  --color-double-denim-600: #486e89;
  --color-double-denim-700: #355870;
  --color-double-denim-800: #26455a;
  --color-double-denim-900: #1b3648;
  --color-double-denim-950: #0e212e;
  --color-treetop-cathedral: #304500;
  --color-treetop-cathedral-50: #ecfcd8;
  --color-treetop-cathedral-100: #e1f3ca;
  --color-treetop-cathedral-200: #cce0b0;
  --color-treetop-cathedral-300: #b2ca92;
  --color-treetop-cathedral-400: #91aa6d;
  --color-treetop-cathedral-500: #748d4f;
  --color-treetop-cathedral-600: #5a7135;
  --color-treetop-cathedral-700: #445922;
  --color-treetop-cathedral-800: #304500;
  --color-treetop-cathedral-900: #26340b;
  --color-treetop-cathedral-950: #162004;
}