Dawn Patrol to Summer of ’82 color palette

About this palette

Dawn Patrol to Summer of ’82 is a 5-color vintage palette: #FFE1DD (Dawn Patrol), #783F40 (Wild Berry), #B28A00 (Arrowwood), #142856 (Space Cadet), #6ECEDA (Summer of ’82). It mixes white, red, yellow, blue, turquoise tones and feels balanced overall. The strongest text pairing is #FFE1DD on #142856 with a contrast ratio of 11.63:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Dawn Patrolrgb(255, 225, 221)hsl(7, 100%, 93%)
Wild Berryrgb(120, 63, 64)hsl(359, 31%, 36%)
Arrowwoodrgb(178, 138, 0)hsl(47, 100%, 35%)
Space Cadetrgb(20, 40, 86)hsl(222, 62%, 21%)
Summer of ’82rgb(110, 206, 218)hsl(187, 59%, 64%)

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.

  • Aa11.63:1 Very good#FFE1DD on #142856
  • Aa11.63:1 Very good#142856 on #FFE1DD
  • Aa7.84:1 Very good#142856 on #6ECEDA
  • Aa7.84:1 Very good#6ECEDA on #142856
  • Aa6.61:1 Good#FFE1DD on #783F40
  • Aa6.61:1 Good#783F40 on #FFE1DD
  • Aa4.45:1 Poor#783F40 on #6ECEDA
  • Aa4.45:1 Poor#6ECEDA on #783F40

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Dawn Patrol to Summer of ’82 — https://swatchly.xyz/palette/ffe1dd-783f40-b28a00-142856-6eceda */
:root {
  --dawn-patrol: #ffe1dd;
  --wild-berry: #783f40;
  --arrowwood: #b28a00;
  --space-cadet: #142856;
  --summer-of-82: #6eceda;
}

Tailwind CSS v4

/* Dawn Patrol to Summer of ’82 — https://swatchly.xyz/palette/ffe1dd-783f40-b28a00-142856-6eceda */
@theme {
  --color-dawn-patrol: #ffe1dd;
  --color-dawn-patrol-50: #ffefed;
  --color-dawn-patrol-100: #ffe1dd;
  --color-dawn-patrol-200: #e6d0cd;
  --color-dawn-patrol-300: #d2b9b6;
  --color-dawn-patrol-400: #b49996;
  --color-dawn-patrol-500: #997e7b;
  --color-dawn-patrol-600: #7e6461;
  --color-dawn-patrol-700: #664f4c;
  --color-dawn-patrol-800: #513d3a;
  --color-dawn-patrol-900: #3f2e2c;
  --color-dawn-patrol-950: #281c1a;
  --color-wild-berry: #783f40;
  --color-wild-berry-50: #fff1f1;
  --color-wild-berry-100: #ffe4e3;
  --color-wild-berry-200: #fcc8c7;
  --color-wild-berry-300: #e9afae;
  --color-wild-berry-400: #cb8d8c;
  --color-wild-berry-500: #af7070;
  --color-wild-berry-600: #915657;
  --color-wild-berry-700: #783f40;
  --color-wild-berry-800: #5e3131;
  --color-wild-berry-900: #4a2425;
  --color-wild-berry-950: #301515;
  --color-arrowwood: #b28a00;
  --color-arrowwood-50: #fff6e2;
  --color-arrowwood-100: #ffedc3;
  --color-arrowwood-200: #f7da93;
  --color-arrowwood-300: #e6c471;
  --color-arrowwood-400: #cba540;
  --color-arrowwood-500: #b28a00;
  --color-arrowwood-600: #906f00;
  --color-arrowwood-700: #725700;
  --color-arrowwood-800: #594300;
  --color-arrowwood-900: #443300;
  --color-arrowwood-950: #2b1f00;
  --color-space-cadet: #142856;
  --color-space-cadet-50: #f0f5ff;
  --color-space-cadet-100: #e2ecff;
  --color-space-cadet-200: #c4d8ff;
  --color-space-cadet-300: #a9c1f2;
  --color-space-cadet-400: #85a0d5;
  --color-space-cadet-500: #6882b8;
  --color-space-cadet-600: #4e6699;
  --color-space-cadet-700: #394e7b;
  --color-space-cadet-800: #293a60;
  --color-space-cadet-900: #142856;
  --color-space-cadet-950: #0f192e;
  --color-summer-of-82: #6eceda;
  --color-summer-of-82-50: #d8fbff;
  --color-summer-of-82-100: #bbf4fc;
  --color-summer-of-82-200: #9de2eb;
  --color-summer-of-82-300: #6eceda;
  --color-summer-of-82-400: #51aeb9;
  --color-summer-of-82-500: #2c939f;
  --color-summer-of-82-600: #007883;
  --color-summer-of-82-700: #006069;
  --color-summer-of-82-800: #004b53;
  --color-summer-of-82-900: #003b41;
  --color-summer-of-82-950: #002529;
}

Similar palettes