Corbeau to Sea Glass Teal Color Palette

About this palette

Corbeau to Sea Glass Teal is a 5-color palette: #171121 (Corbeau), #603102 (Chocolate Fantasies), #8E3BD4 (Dreamscape Purple), #DD9162 (Summer’s End), #92E9D4 (Sea Glass Teal). It mixes black, brown, purple, orange, turquoise tones and feels balanced overall. The strongest text pairing is #171121 on #92E9D4 with a contrast ratio of 13.02:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Corbeau	rgb(23, 17, 33)	hsl(262, 32%, 10%)
Chocolate Fantasies	rgb(96, 49, 2)	hsl(30, 96%, 19%)
Dreamscape Purple	rgb(142, 59, 212)	hsl(273, 64%, 53%)
Summer’s End	rgb(221, 145, 98)	hsl(23, 64%, 63%)
Sea Glass Teal	rgb(146, 233, 212)	hsl(166, 66%, 74%)

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.

Aa13.02:1 Super#171121 on #92E9D4
Aa13.02:1 Super#92E9D4 on #171121
Aa7.65:1 Very good#603102 on #92E9D4
Aa7.65:1 Very good#92E9D4 on #603102
Aa7.29:1 Very good#171121 on #DD9162
Aa7.29:1 Very good#DD9162 on #171121
Aa4.28:1 Poor#603102 on #DD9162
Aa4.28:1 Poor#DD9162 on #603102

Color blindness preview

CSS variables

/* Corbeau to Sea Glass Teal — https://swatchly.xyz/palette/171121-603102-8e3bd4-dd9162-92e9d4 */
:root {
  --corbeau: #171121;
  --chocolate-fantasies: #603102;
  --dreamscape-purple: #8e3bd4;
  --summer-s-end: #dd9162;
  --sea-glass-teal: #92e9d4;
}

Tailwind CSS v4

/* Corbeau to Sea Glass Teal — https://swatchly.xyz/palette/171121-603102-8e3bd4-dd9162-92e9d4 */
@theme {
  --color-corbeau: #171121;
  --color-corbeau-50: #f7f3ff;
  --color-corbeau-100: #ede8f7;
  --color-corbeau-200: #dad4e5;
  --color-corbeau-300: #c4bdd1;
  --color-corbeau-400: #a49db3;
  --color-corbeau-500: #878095;
  --color-corbeau-600: #6a6377;
  --color-corbeau-700: #514b5d;
  --color-corbeau-800: #3c3746;
  --color-corbeau-900: #2b2732;
  --color-corbeau-950: #171121;
  --color-chocolate-fantasies: #603102;
  --color-chocolate-fantasies-50: #fff2ea;
  --color-chocolate-fantasies-100: #ffe6d4;
  --color-chocolate-fantasies-200: #f9ceaf;
  --color-chocolate-fantasies-300: #e6b591;
  --color-chocolate-fantasies-400: #c8936c;
  --color-chocolate-fantasies-500: #ac774e;
  --color-chocolate-fantasies-600: #8e5c35;
  --color-chocolate-fantasies-700: #734622;
  --color-chocolate-fantasies-800: #603102;
  --color-chocolate-fantasies-900: #47270b;
  --color-chocolate-fantasies-950: #2e1704;
  --color-dreamscape-purple: #8e3bd4;
  --color-dreamscape-purple-50: #f8f2ff;
  --color-dreamscape-purple-100: #f1e7ff;
  --color-dreamscape-purple-200: #e3ceff;
  --color-dreamscape-purple-300: #d4b0ff;
  --color-dreamscape-purple-400: #bf82ff;
  --color-dreamscape-purple-500: #a95af2;
  --color-dreamscape-purple-600: #8e3bd4;
  --color-dreamscape-purple-700: #7423b2;
  --color-dreamscape-purple-800: #5d0f93;
  --color-dreamscape-purple-900: #490277;
  --color-dreamscape-purple-950: #2f004f;
  --color-summer-s-end: #dd9162;
  --color-summer-s-end-50: #fff4ee;
  --color-summer-s-end-100: #ffe8db;
  --color-summer-s-end-200: #ffcfb3;
  --color-summer-s-end-300: #f6b48c;
  --color-summer-s-end-400: #dd9162;
  --color-summer-s-end-500: #be7546;
  --color-summer-s-end-600: #a05a2b;
  --color-summer-s-end-700: #834416;
  --color-summer-s-end-800: #693206;
  --color-summer-s-end-900: #532400;
  --color-summer-s-end-950: #351500;
  --color-sea-glass-teal: #92e9d4;
  --color-sea-glass-teal-50: #d2fff3;
  --color-sea-glass-teal-100: #c2f6e8;
  --color-sea-glass-teal-200: #92e9d4;
  --color-sea-glass-teal-300: #87d0be;
  --color-sea-glass-teal-400: #5fb29f;
  --color-sea-glass-teal-500: #3e9784;
  --color-sea-glass-teal-600: #1f7c6a;
  --color-sea-glass-teal-700: #016454;
  --color-sea-glass-teal-800: #004e42;
  --color-sea-glass-teal-900: #003c32;
  --color-sea-glass-teal-950: #00261f;
}