Summer of ’82 to Kingfisher Daisy Color Palette

About this palette

Summer of ’82 to Kingfisher Daisy is a 5-color cool palette: #7BCDD7 (Summer of ’82), #B0BA71 (Savannah Grass), #C25334 (Fox), #597500 (Topiary Green), #533A78 (Kingfisher Daisy). It mixes turquoise, green, red, purple tones and feels cool overall. The strongest text pairing is #7BCDD7 on #533A78 with a contrast ratio of 5.15:1, and 2 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Summer of ’82	rgb(123, 205, 215)	hsl(187, 53%, 66%)
Savannah Grass	rgb(176, 186, 113)	hsl(68, 35%, 59%)
Fox	rgb(194, 83, 52)	hsl(13, 58%, 48%)
Topiary Green	rgb(89, 117, 0)	hsl(74, 100%, 23%)
Kingfisher Daisy	rgb(83, 58, 120)	hsl(264, 35%, 35%)

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.15:1 Good#7BCDD7 on #533A78
Aa5.15:1 Good#533A78 on #7BCDD7
Aa4.50:1 Good#B0BA71 on #533A78
Aa4.50:1 Good#533A78 on #B0BA71

Color blindness preview

CSS variables

/* Summer of ’82 to Kingfisher Daisy — https://swatchly.xyz/palette/7bcdd7-b0ba71-c25334-597500-533a78 */
:root {
  --summer-of-82: #7bcdd7;
  --savannah-grass: #b0ba71;
  --fox: #c25334;
  --topiary-green: #597500;
  --kingfisher-daisy: #533a78;
}

Tailwind CSS v4

/* Summer of ’82 to Kingfisher Daisy — https://swatchly.xyz/palette/7bcdd7-b0ba71-c25334-597500-533a78 */
@theme {
  --color-summer-of-82: #7bcdd7;
  --color-summer-of-82-50: #d9fbff;
  --color-summer-of-82-100: #c2f3fa;
  --color-summer-of-82-200: #a5e1e8;
  --color-summer-of-82-300: #7bcdd7;
  --color-summer-of-82-400: #5fadb7;
  --color-summer-of-82-500: #3e929c;
  --color-summer-of-82-600: #217781;
  --color-summer-of-82-700: #056068;
  --color-summer-of-82-800: #004b53;
  --color-summer-of-82-900: #003b40;
  --color-summer-of-82-950: #002529;
  --color-savannah-grass: #b0ba71;
  --color-savannah-grass-50: #ecf3c7;
  --color-savannah-grass-100: #dfe7b5;
  --color-savannah-grass-200: #c9d297;
  --color-savannah-grass-300: #b0ba71;
  --color-savannah-grass-400: #949d56;
  --color-savannah-grass-500: #7b843c;
  --color-savannah-grass-600: #646b25;
  --color-savannah-grass-700: #505613;
  --color-savannah-grass-800: #3f4506;
  --color-savannah-grass-900: #323701;
  --color-savannah-grass-950: #1f2200;
  --color-fox: #c25334;
  --color-fox-50: #ffefea;
  --color-fox-100: #ffdfd5;
  --color-fox-200: #ffc0ae;
  --color-fox-300: #ff997d;
  --color-fox-400: #e27253;
  --color-fox-500: #c25334;
  --color-fox-600: #a43b1d;
  --color-fox-700: #88290b;
  --color-fox-800: #6f1b01;
  --color-fox-900: #581300;
  --color-fox-950: #3b0900;
  --color-topiary-green: #597500;
  --color-topiary-green-50: #eafeca;
  --color-topiary-green-100: #dff5b9;
  --color-topiary-green-200: #c8e29b;
  --color-topiary-green-300: #b0cc7a;
  --color-topiary-green-400: #8fad50;
  --color-topiary-green-500: #73912d;
  --color-topiary-green-600: #597500;
  --color-topiary-green-700: #465d00;
  --color-topiary-green-800: #364900;
  --color-topiary-green-900: #293800;
  --color-topiary-green-950: #182300;
  --color-kingfisher-daisy: #533a78;
  --color-kingfisher-daisy-50: #f7f3ff;
  --color-kingfisher-daisy-100: #eee7ff;
  --color-kingfisher-daisy-200: #deceff;
  --color-kingfisher-daisy-300: #cbb6f3;
  --color-kingfisher-daisy-400: #ae96d9;
  --color-kingfisher-daisy-500: #947bbf;
  --color-kingfisher-daisy-600: #7b62a3;
  --color-kingfisher-daisy-700: #654d8a;
  --color-kingfisher-daisy-800: #533a78;
  --color-kingfisher-daisy-900: #402d5b;
  --color-kingfisher-daisy-950: #291b3d;
}