Bunny Tail to Godzilla Color Palette

About this palette

Bunny Tail to Godzilla is a 5-color warm, vintage palette: #FFE1F1 (Bunny Tail), #BFBC74 (Savannah Grass), #A285FB (Periwinkle), #008163 (Shadows of Time), #504B00 (Godzilla). It mixes pink, yellow, purple, turquoise, brown tones and feels warm overall. The strongest text pairing is #FFE1F1 on #504B00 with a contrast ratio of 7.37:1, and 2 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Bunny Tail	rgb(255, 225, 241)	hsl(328, 100%, 94%)
Savannah Grass	rgb(191, 188, 116)	hsl(58, 37%, 60%)
Periwinkle	rgb(162, 133, 251)	hsl(255, 94%, 75%)
Shadows of Time	rgb(0, 129, 99)	hsl(166, 100%, 25%)
Godzilla	rgb(80, 75, 0)	hsl(56, 100%, 16%)

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.37:1 Very good#FFE1F1 on #504B00
Aa7.37:1 Very good#504B00 on #FFE1F1
Aa4.54:1 Good#BFBC74 on #504B00
Aa4.54:1 Good#504B00 on #BFBC74
Aa4.00:1 Poor#FFE1F1 on #008163
Aa4.00:1 Poor#008163 on #FFE1F1
Aa3.10:1 Poor#A285FB on #504B00
Aa3.10:1 Poor#504B00 on #A285FB

Color blindness preview

CSS variables

/* Bunny Tail to Godzilla — https://swatchly.xyz/palette/ffe1f1-bfbc74-a285fb-008163-504b00 */
:root {
  --bunny-tail: #ffe1f1;
  --savannah-grass: #bfbc74;
  --periwinkle: #a285fb;
  --shadows-of-time: #008163;
  --godzilla: #504b00;
}

Tailwind CSS v4

/* Bunny Tail to Godzilla — https://swatchly.xyz/palette/ffe1f1-bfbc74-a285fb-008163-504b00 */
@theme {
  --color-bunny-tail: #ffe1f1;
  --color-bunny-tail-50: #fff0f8;
  --color-bunny-tail-100: #ffe1f1;
  --color-bunny-tail-200: #e6d0dc;
  --color-bunny-tail-300: #d1b9c6;
  --color-bunny-tail-400: #b398a7;
  --color-bunny-tail-500: #987d8c;
  --color-bunny-tail-600: #7c6371;
  --color-bunny-tail-700: #644d5a;
  --color-bunny-tail-800: #4f3c46;
  --color-bunny-tail-900: #3e2d36;
  --color-bunny-tail-950: #271b22;
  --color-savannah-grass: #bfbc74;
  --color-savannah-grass-50: #f4f3ca;
  --color-savannah-grass-100: #e9e8b9;
  --color-savannah-grass-200: #d5d39c;
  --color-savannah-grass-300: #bfbc74;
  --color-savannah-grass-400: #a19e59;
  --color-savannah-grass-500: #88843d;
  --color-savannah-grass-600: #6e6b24;
  --color-savannah-grass-700: #595511;
  --color-savannah-grass-800: #474304;
  --color-savannah-grass-900: #373500;
  --color-savannah-grass-950: #232000;
  --color-periwinkle: #a285fb;
  --color-periwinkle-50: #f3f1ff;
  --color-periwinkle-100: #e9e5ff;
  --color-periwinkle-200: #d5ccff;
  --color-periwinkle-300: #bfafff;
  --color-periwinkle-400: #a285fb;
  --color-periwinkle-500: #886add;
  --color-periwinkle-600: #6f50be;
  --color-periwinkle-700: #593b9f;
  --color-periwinkle-800: #462b83;
  --color-periwinkle-900: #371e6a;
  --color-periwinkle-950: #231148;
  --color-shadows-of-time: #008163;
  --color-shadows-of-time-50: #dafff0;
  --color-shadows-of-time-100: #c1fae4;
  --color-shadows-of-time-200: #a4eacf;
  --color-shadows-of-time-300: #84d5b8;
  --color-shadows-of-time-400: #58b798;
  --color-shadows-of-time-500: #339c7d;
  --color-shadows-of-time-600: #008163;
  --color-shadows-of-time-700: #00674e;
  --color-shadows-of-time-800: #00503c;
  --color-shadows-of-time-900: #003e2e;
  --color-shadows-of-time-950: #00271c;
  --color-godzilla: #504b00;
  --color-godzilla-50: #f9f8d3;
  --color-godzilla-100: #f0eec5;
  --color-godzilla-200: #dddbaa;
  --color-godzilla-300: #c9c68e;
  --color-godzilla-400: #aba76a;
  --color-godzilla-500: #918d4d;
  --color-godzilla-600: #787334;
  --color-godzilla-700: #625d21;
  --color-godzilla-800: #504b00;
  --color-godzilla-900: #3d3a07;
  --color-godzilla-950: #272402;
}