Good Morning to Secret Passage color palette

FBFCD8Good Morning DAAEC2Roseate Spoonbill 5C947AMartian Cerulean 565B86Wizard 342D07Secret Passage

About this palette

Good Morning to Secret Passage is a 5-color muted, warm, vintage palette: #FBFCD8 (Good Morning), #DAAEC2 (Roseate Spoonbill), #5C947A (Martian Cerulean), #565B86 (Wizard), #342D07 (Secret Passage). It mixes white, pink, green, purple, brown tones and feels warm overall. The strongest text pairing is #FBFCD8 on #342D07 with a contrast ratio of 13.13:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Good Morning	rgb(251, 252, 216)	hsl(62, 86%, 92%)
Roseate Spoonbill	rgb(218, 174, 194)	hsl(333, 37%, 77%)
Martian Cerulean	rgb(92, 148, 122)	hsl(152, 23%, 47%)
Wizard	rgb(86, 91, 134)	hsl(234, 22%, 43%)
Secret Passage	rgb(52, 45, 7)	hsl(51, 76%, 12%)

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.13:1 Super#FBFCD8 on #342D07
Aa13.13:1 Super#342D07 on #FBFCD8
Aa7.09:1 Very good#DAAEC2 on #342D07
Aa7.09:1 Very good#342D07 on #DAAEC2
Aa6.19:1 Good#FBFCD8 on #565B86
Aa6.19:1 Good#565B86 on #FBFCD8
Aa3.92:1 Poor#5C947A on #342D07
Aa3.92:1 Poor#342D07 on #5C947A

Color blindness preview

CSS variables

/* Good Morning to Secret Passage — https://swatchly.xyz/palette/fbfcd8-daaec2-5c947a-565b86-342d07 */
:root {
  --good-morning: #fbfcd8;
  --roseate-spoonbill: #daaec2;
  --martian-cerulean: #5c947a;
  --wizard: #565b86;
  --secret-passage: #342d07;
}

Tailwind CSS v4

/* Good Morning to Secret Passage — https://swatchly.xyz/palette/fbfcd8-daaec2-5c947a-565b86-342d07 */
@theme {
  --color-good-morning: #fbfcd8;
  --color-good-morning-50: #fbfcd8;
  --color-good-morning-100: #eff0db;
  --color-good-morning-200: #dbdcc3;
  --color-good-morning-300: #c4c5a8;
  --color-good-morning-400: #a5a585;
  --color-good-morning-500: #898969;
  --color-good-morning-600: #6e6e4f;
  --color-good-morning-700: #57573b;
  --color-good-morning-800: #44442b;
  --color-good-morning-900: #34341f;
  --color-good-morning-950: #202011;
  --color-roseate-spoonbill: #daaec2;
  --color-roseate-spoonbill-50: #ffedf5;
  --color-roseate-spoonbill-100: #fcdfec;
  --color-roseate-spoonbill-200: #ebc9d8;
  --color-roseate-spoonbill-300: #daaec2;
  --color-roseate-spoonbill-400: #b990a3;
  --color-roseate-spoonbill-500: #9e7689;
  --color-roseate-spoonbill-600: #835d6f;
  --color-roseate-spoonbill-700: #6b4858;
  --color-roseate-spoonbill-800: #553746;
  --color-roseate-spoonbill-900: #432a36;
  --color-roseate-spoonbill-950: #2b1922;
  --color-martian-cerulean: #5c947a;
  --color-martian-cerulean-50: #defeee;
  --color-martian-cerulean-100: #d1f5e3;
  --color-martian-cerulean-200: #b9e3ce;
  --color-martian-cerulean-300: #9dceb6;
  --color-martian-cerulean-400: #79af95;
  --color-martian-cerulean-500: #5c947a;
  --color-martian-cerulean-600: #427960;
  --color-martian-cerulean-700: #2e614b;
  --color-martian-cerulean-800: #1f4c39;
  --color-martian-cerulean-900: #143b2b;
  --color-martian-cerulean-950: #09251a;
  --color-wizard: #565b86;
  --color-wizard-50: #f3f4ff;
  --color-wizard-100: #e6eaff;
  --color-wizard-200: #d1d7fb;
  --color-wizard-300: #bbc2eb;
  --color-wizard-400: #9da3d0;
  --color-wizard-500: #8389b7;
  --color-wizard-600: #6b709d;
  --color-wizard-700: #565b86;
  --color-wizard-800: #43476b;
  --color-wizard-900: #323655;
  --color-wizard-950: #1f2138;
  --color-secret-passage: #342d07;
  --color-secret-passage-50: #faf6df;
  --color-secret-passage-100: #f1ecd3;
  --color-secret-passage-200: #ded8ba;
  --color-secret-passage-300: #c8c2a0;
  --color-secret-passage-400: #a8a17c;
  --color-secret-passage-500: #8c855f;
  --color-secret-passage-600: #706945;
  --color-secret-passage-700: #585131;
  --color-secret-passage-800: #433e22;
  --color-secret-passage-900: #342d07;
  --color-secret-passage-950: #1e1b0b;
}