Goose Bill to Cookie Dough color palette

FFBB87Goose Bill 003C35Rich Black 00C3BDTurquoise 9537CCDreamscape Purple 61368BLucid Dreams AF7300Cookie Dough

Open in generator Export PNG, PDF, ASE…

About this palette

Goose Bill to Cookie Dough is a 6-color cool palette: #FFBB87 (Goose Bill), #003C35 (Rich Black), #00C3BD (Turquoise), #9537CC (Dreamscape Purple), #61368B (Lucid Dreams), #AF7300 (Cookie Dough). It mixes orange, turquoise, purple tones and feels cool overall. The strongest text pairing is #FFBB87 on #003C35 with a contrast ratio of 7.49:1, and 3 of its 15 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Goose Bill	rgb(255, 187, 135)	hsl(26, 100%, 76%)
Rich Black	rgb(0, 60, 53)	hsl(173, 100%, 12%)
Turquoise	rgb(0, 195, 189)	hsl(178, 100%, 38%)
Dreamscape Purple	rgb(149, 55, 204)	hsl(278, 59%, 51%)
Lucid Dreams	rgb(97, 54, 139)	hsl(270, 44%, 38%)
Cookie Dough	rgb(175, 115, 0)	hsl(39, 100%, 34%)

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.

Aa7.49:1 Very good#FFBB87 on #003C35
Aa7.49:1 Very good#003C35 on #FFBB87
Aa5.62:1 Good#003C35 on #00C3BD
Aa5.62:1 Good#00C3BD on #003C35
Aa5.28:1 Good#FFBB87 on #61368B
Aa5.28:1 Good#61368B on #FFBB87
Aa3.96:1 Poor#00C3BD on #61368B
Aa3.96:1 Poor#61368B on #00C3BD

Color blindness preview

CSS variables

/* Goose Bill to Cookie Dough — https://swatchly.xyz/palette/ffbb87-003c35-00c3bd-9537cc-61368b-af7300 */
:root {
  --goose-bill: #ffbb87;
  --rich-black: #003c35;
  --turquoise: #00c3bd;
  --dreamscape-purple: #9537cc;
  --lucid-dreams: #61368b;
  --cookie-dough: #af7300;
}

Tailwind CSS v4

/* Goose Bill to Cookie Dough — https://swatchly.xyz/palette/ffbb87-003c35-00c3bd-9537cc-61368b-af7300 */
@theme {
  --color-goose-bill: #ffbb87;
  --color-goose-bill-50: #fff9f6;
  --color-goose-bill-100: #ffefe4;
  --color-goose-bill-200: #ffd8bb;
  --color-goose-bill-300: #ffbb87;
  --color-goose-bill-400: #d89b6b;
  --color-goose-bill-500: #bb7c4a;
  --color-goose-bill-600: #9d602d;
  --color-goose-bill-700: #804917;
  --color-goose-bill-800: #663606;
  --color-goose-bill-900: #4f2700;
  --color-goose-bill-950: #331700;
  --color-rich-black: #003c35;
  --color-rich-black-50: #dffdf7;
  --color-rich-black-100: #d3f3ed;
  --color-rich-black-200: #bae1da;
  --color-rich-black-300: #9fccc3;
  --color-rich-black-400: #7bada4;
  --color-rich-black-500: #5e9289;
  --color-rich-black-600: #44776e;
  --color-rich-black-700: #305f57;
  --color-rich-black-800: #214b44;
  --color-rich-black-900: #003c35;
  --color-rich-black-950: #0a2420;
  --color-turquoise: #00c3bd;
  --color-turquoise-50: #e3fffd;
  --color-turquoise-100: #bbfffa;
  --color-turquoise-200: #94f1ec;
  --color-turquoise-300: #6cded8;
  --color-turquoise-400: #00c3bd;
  --color-turquoise-500: #00a29d;
  --color-turquoise-600: #00827e;
  --color-turquoise-700: #006764;
  --color-turquoise-800: #00504d;
  --color-turquoise-900: #003d3b;
  --color-turquoise-950: #002524;
  --color-dreamscape-purple: #9537cc;
  --color-dreamscape-purple-50: #f9f2ff;
  --color-dreamscape-purple-100: #f3e5ff;
  --color-dreamscape-purple-200: #e8cbff;
  --color-dreamscape-purple-300: #dbacff;
  --color-dreamscape-purple-400: #c97aff;
  --color-dreamscape-purple-500: #b056ea;
  --color-dreamscape-purple-600: #9537cc;
  --color-dreamscape-purple-700: #7a1fab;
  --color-dreamscape-purple-800: #620b8d;
  --color-dreamscape-purple-900: #4d0071;
  --color-dreamscape-purple-950: #32004b;
  --color-lucid-dreams: #61368b;
  --color-lucid-dreams-50: #f8f2ff;
  --color-lucid-dreams-100: #f0e6ff;
  --color-lucid-dreams-200: #e1cbff;
  --color-lucid-dreams-300: #d0abfd;
  --color-lucid-dreams-400: #b188e1;
  --color-lucid-dreams-500: #956ac4;
  --color-lucid-dreams-600: #784fa4;
  --color-lucid-dreams-700: #61368b;
  --color-lucid-dreams-800: #4b2a6c;
  --color-lucid-dreams-900: #3b1f56;
  --color-lucid-dreams-950: #251139;
  --color-cookie-dough: #af7300;
  --color-cookie-dough-50: #fff2e2;
  --color-cookie-dough-100: #ffe5c4;
  --color-cookie-dough-200: #fccb8c;
  --color-cookie-dough-300: #e9b268;
  --color-cookie-dough-400: #cc9038;
  --color-cookie-dough-500: #af7300;
  --color-cookie-dough-600: #8e5c00;
  --color-cookie-dough-700: #714900;
  --color-cookie-dough-800: #593800;
  --color-cookie-dough-900: #462b00;
  --color-cookie-dough-950: #2d1a00;
}