Bermudagrass to Godzilla Color Palette

About this palette

Bermudagrass to Godzilla is a 4-color cool, monochromatic, gradient palette: #57C46F (Bermudagrass), #4F9A4C (Kryptonite Green), #457129 (Botanical), #384B00 (Godzilla). It mixes green tones and feels cool overall. The strongest text pairing is #57C46F on #384B00 with a contrast ratio of 4.38:1, and 0 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Bermudagrass	rgb(87, 196, 111)	hsl(133, 48%, 55%)
Kryptonite Green	rgb(79, 154, 76)	hsl(118, 34%, 45%)
Botanical	rgb(69, 113, 41)	hsl(97, 47%, 30%)
Godzilla	rgb(56, 75, 0)	hsl(75, 100%, 15%)

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.

Aa4.38:1 Poor#57C46F on #384B00
Aa4.38:1 Poor#384B00 on #57C46F

Color blindness preview

CSS variables

/* Bermudagrass to Godzilla — https://swatchly.xyz/palette/57c46f-4f9a4c-457129-384b00 */
:root {
  --bermudagrass: #57c46f;
  --kryptonite-green: #4f9a4c;
  --botanical: #457129;
  --godzilla: #384b00;
}

Tailwind CSS v4

/* Bermudagrass to Godzilla — https://swatchly.xyz/palette/57c46f-4f9a4c-457129-384b00 */
@theme {
  --color-bermudagrass: #57c46f;
  --color-bermudagrass-50: #e9ffeb;
  --color-bermudagrass-100: #ccffd2;
  --color-bermudagrass-200: #a9f2b4;
  --color-bermudagrass-300: #8adf98;
  --color-bermudagrass-400: #57c46f;
  --color-bermudagrass-500: #36a653;
  --color-bermudagrass-600: #018837;
  --color-bermudagrass-700: #006c2a;
  --color-bermudagrass-800: #00541f;
  --color-bermudagrass-900: #004016;
  --color-bermudagrass-950: #00280a;
  --color-kryptonite-green: #4f9a4c;
  --color-kryptonite-green-50: #e1ffde;
  --color-kryptonite-green-100: #cbfac7;
  --color-kryptonite-green-200: #b0e9ac;
  --color-kryptonite-green-300: #93d48f;
  --color-kryptonite-green-400: #6eb66a;
  --color-kryptonite-green-500: #4f9a4c;
  --color-kryptonite-green-600: #347e32;
  --color-kryptonite-green-700: #20661f;
  --color-kryptonite-green-800: #115011;
  --color-kryptonite-green-900: #063f07;
  --color-kryptonite-green-950: #022802;
  --color-botanical: #457129;
  --color-botanical-50: #e4ffd6;
  --color-botanical-100: #d5f5c5;
  --color-botanical-200: #bce2a9;
  --color-botanical-300: #a0cb8a;
  --color-botanical-400: #7dab64;
  --color-botanical-500: #608e45;
  --color-botanical-600: #457129;
  --color-botanical-700: #345a1b;
  --color-botanical-800: #26470f;
  --color-botanical-900: #1b3707;
  --color-botanical-950: #0f2302;
  --color-godzilla: #384b00;
  --color-godzilla-50: #edfcd6;
  --color-godzilla-100: #e2f3c8;
  --color-godzilla-200: #cde0ad;
  --color-godzilla-300: #b5cb90;
  --color-godzilla-400: #95ac6b;
  --color-godzilla-500: #7a904e;
  --color-godzilla-600: #607535;
  --color-godzilla-700: #4b5e21;
  --color-godzilla-800: #384b00;
  --color-godzilla-900: #2b390a;
  --color-godzilla-950: #1a2403;
}