Reptile Revenge to Bonsai Garden Color Palette

About this palette

Reptile Revenge to Bonsai Garden is a 4-color muted palette: #57542D (Reptile Revenge), #F2F0DF (Bianca), #252410 (Underworld), #A19F83 (Bonsai Garden). It mixes brown, white, gray, yellow tones and feels warm overall. The strongest text pairing is #F2F0DF on #252410 with a contrast ratio of 13.68:1, and 3 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Reptile Revenge	rgb(87, 84, 45)	hsl(56, 32%, 26%)
Bianca	rgb(242, 240, 223)	hsl(54, 42%, 91%)
Underworld	rgb(37, 36, 16)	hsl(57, 40%, 10%)
Bonsai Garden	rgb(161, 159, 131)	hsl(56, 14%, 57%)

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.68:1 Super#F2F0DF on #252410
Aa13.68:1 Super#252410 on #F2F0DF
Aa6.75:1 Good#57542D on #F2F0DF
Aa6.75:1 Good#F2F0DF on #57542D
Aa5.83:1 Good#252410 on #A19F83
Aa5.83:1 Good#A19F83 on #252410

Color blindness preview

CSS variables

/* Reptile Revenge to Bonsai Garden — https://swatchly.xyz/palette/57542d-f2f0df-252410-a19f83 */
:root {
  --reptile-revenge: #57542d;
  --bianca: #f2f0df;
  --underworld: #252410;
  --bonsai-garden: #a19f83;
}

Tailwind CSS v4

/* Reptile Revenge to Bonsai Garden — https://swatchly.xyz/palette/57542d-f2f0df-252410-a19f83 */
@theme {
  --color-reptile-revenge: #57542d;
  --color-reptile-revenge-50: #f8f7df;
  --color-reptile-revenge-100: #eeedd2;
  --color-reptile-revenge-200: #dbd9b9;
  --color-reptile-revenge-300: #c4c29d;
  --color-reptile-revenge-400: #a5a27a;
  --color-reptile-revenge-500: #89865e;
  --color-reptile-revenge-600: #6e6b44;
  --color-reptile-revenge-700: #57542d;
  --color-reptile-revenge-800: #444123;
  --color-reptile-revenge-900: #343218;
  --color-reptile-revenge-950: #201f0c;
  --color-bianca: #f2f0df;
  --color-bianca-50: #faf9f0;
  --color-bianca-100: #f2f0df;
  --color-bianca-200: #dddbcf;
  --color-bianca-300: #c6c4b6;
  --color-bianca-400: #a6a495;
  --color-bianca-500: #8a8879;
  --color-bianca-600: #6f6d5e;
  --color-bianca-700: #575649;
  --color-bianca-800: #444337;
  --color-bianca-900: #34332a;
  --color-bianca-950: #202019;
  --color-underworld: #252410;
  --color-underworld-50: #f6f6e8;
  --color-underworld-100: #edecdd;
  --color-underworld-200: #d9d9c6;
  --color-underworld-300: #c3c2ad;
  --color-underworld-400: #a4a38c;
  --color-underworld-500: #898971;
  --color-underworld-600: #6f6f59;
  --color-underworld-700: #595944;
  --color-underworld-800: #474634;
  --color-underworld-900: #383728;
  --color-underworld-950: #252410;
  --color-bonsai-garden: #a19f83;
  --color-bonsai-garden-50: #f6f5e4;
  --color-bonsai-garden-100: #ebead7;
  --color-bonsai-garden-200: #d7d6c0;
  --color-bonsai-garden-300: #c1bfa6;
  --color-bonsai-garden-400: #a19f83;
  --color-bonsai-garden-500: #868469;
  --color-bonsai-garden-600: #6d6b51;
  --color-bonsai-garden-700: #56553d;
  --color-bonsai-garden-800: #44422e;
  --color-bonsai-garden-900: #353322;
  --color-bonsai-garden-950: #212013;
}