Ghost White to Ayahuasca Vine Color Palette

About this palette

Ghost White to Ayahuasca Vine is a 5-color warm, earthy, vintage palette: #F7F8FF (Ghost White), #AB9500 (Greedy Gecko), #00462F (Zucchini), #FF8CC2 (Shimmering Love), #6B5B00 (Ayahuasca Vine). It mixes white, yellow, green, pink, brown tones and feels warm overall. The strongest text pairing is #F7F8FF on #00462F with a contrast ratio of 10.34:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Ghost White	rgb(247, 248, 255)	hsl(233, 100%, 98%)
Greedy Gecko	rgb(171, 149, 0)	hsl(52, 100%, 34%)
Zucchini	rgb(0, 70, 47)	hsl(160, 100%, 14%)
Shimmering Love	rgb(255, 140, 194)	hsl(332, 100%, 77%)
Ayahuasca Vine	rgb(107, 91, 0)	hsl(51, 100%, 21%)

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.

Aa10.34:1 Very good#F7F8FF on #00462F
Aa10.34:1 Very good#00462F on #F7F8FF
Aa6.35:1 Good#F7F8FF on #6B5B00
Aa6.35:1 Good#6B5B00 on #F7F8FF
Aa5.10:1 Good#00462F on #FF8CC2
Aa5.10:1 Good#FF8CC2 on #00462F
Aa3.67:1 Poor#AB9500 on #00462F
Aa3.67:1 Poor#00462F on #AB9500

Color blindness preview

CSS variables

/* Ghost White to Ayahuasca Vine — https://swatchly.xyz/palette/f7f8ff-ab9500-00462f-ff8cc2-6b5b00 */
:root {
  --ghost-white: #f7f8ff;
  --greedy-gecko: #ab9500;
  --zucchini: #00462f;
  --shimmering-love: #ff8cc2;
  --ayahuasca-vine: #6b5b00;
}

Tailwind CSS v4

/* Ghost White to Ayahuasca Vine — https://swatchly.xyz/palette/f7f8ff-ab9500-00462f-ff8cc2-6b5b00 */
@theme {
  --color-ghost-white: #f7f8ff;
  --color-ghost-white-50: #f7f8ff;
  --color-ghost-white-100: #edeef2;
  --color-ghost-white-200: #d9d9de;
  --color-ghost-white-300: #c1c2c8;
  --color-ghost-white-400: #a1a2a8;
  --color-ghost-white-500: #85868c;
  --color-ghost-white-600: #6a6b71;
  --color-ghost-white-700: #54555a;
  --color-ghost-white-800: #414247;
  --color-ghost-white-900: #323236;
  --color-ghost-white-950: #1f1f22;
  --color-greedy-gecko: #ab9500;
  --color-greedy-gecko-50: #fef2b4;
  --color-greedy-gecko-100: #f4e69e;
  --color-greedy-gecko-200: #e1d079;
  --color-greedy-gecko-300: #cab751;
  --color-greedy-gecko-400: #ab9500;
  --color-greedy-gecko-500: #8f7c00;
  --color-greedy-gecko-600: #736400;
  --color-greedy-gecko-700: #5c5000;
  --color-greedy-gecko-800: #493f00;
  --color-greedy-gecko-900: #3a3100;
  --color-greedy-gecko-950: #251f00;
  --color-zucchini: #00462f;
  --color-zucchini-50: #ddfeed;
  --color-zucchini-100: #d0f6e3;
  --color-zucchini-200: #b7e4cd;
  --color-zucchini-300: #9bceb5;
  --color-zucchini-400: #79b297;
  --color-zucchini-500: #5d987c;
  --color-zucchini-600: #447e64;
  --color-zucchini-700: #30674f;
  --color-zucchini-800: #21543f;
  --color-zucchini-900: #00462f;
  --color-zucchini-950: #0a2c1e;
  --color-shimmering-love: #ff8cc2;
  --color-shimmering-love-50: #ffe9f2;
  --color-shimmering-love-100: #ffd8e8;
  --color-shimmering-love-200: #ffb7d6;
  --color-shimmering-love-300: #ff8cc2;
  --color-shimmering-love-400: #dd70a4;
  --color-shimmering-love-500: #c1548a;
  --color-shimmering-love-600: #a33c71;
  --color-shimmering-love-700: #87295b;
  --color-shimmering-love-800: #6f1b48;
  --color-shimmering-love-900: #5a1139;
  --color-shimmering-love-950: #3b0624;
  --color-ayahuasca-vine: #6b5b00;
  --color-ayahuasca-vine-50: #fff6cd;
  --color-ayahuasca-vine-100: #f6ecbe;
  --color-ayahuasca-vine-200: #e6daa3;
  --color-ayahuasca-vine-300: #d2c486;
  --color-ayahuasca-vine-400: #b5a55f;
  --color-ayahuasca-vine-500: #9b8b40;
  --color-ayahuasca-vine-600: #817125;
  --color-ayahuasca-vine-700: #6b5b00;
  --color-ayahuasca-vine-800: #544700;
  --color-ayahuasca-vine-900: #413600;
  --color-ayahuasca-vine-950: #292200;
}