Dainty Peach to Alligator Gladiator Color Palette

About this palette

Dainty Peach to Alligator Gladiator is a 4-color warm, earthy, vintage, gradient palette: #FFD0BE (Dainty Peach), #BD9B7E (French Oak), #7F6942 (Lizard), #473B00 (Alligator Gladiator). It mixes orange, brown tones and feels warm overall. The strongest text pairing is #FFD0BE on #473B00 with a contrast ratio of 7.93:1, and 1 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Dainty Peach	rgb(255, 208, 190)	hsl(17, 100%, 87%)
French Oak	rgb(189, 155, 126)	hsl(28, 32%, 62%)
Lizard	rgb(127, 105, 66)	hsl(38, 32%, 38%)
Alligator Gladiator	rgb(71, 59, 0)	hsl(50, 100%, 14%)

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.93:1 Very good#FFD0BE on #473B00
Aa7.93:1 Very good#473B00 on #FFD0BE
Aa4.31:1 Poor#BD9B7E on #473B00
Aa4.31:1 Poor#473B00 on #BD9B7E
Aa3.75:1 Poor#FFD0BE on #7F6942
Aa3.75:1 Poor#7F6942 on #FFD0BE

Color blindness preview

CSS variables

/* Dainty Peach to Alligator Gladiator — https://swatchly.xyz/palette/ffd0be-bd9b7e-7f6942-473b00 */
:root {
  --dainty-peach: #ffd0be;
  --french-oak: #bd9b7e;
  --lizard: #7f6942;
  --alligator-gladiator: #473b00;
}

Tailwind CSS v4

/* Dainty Peach to Alligator Gladiator — https://swatchly.xyz/palette/ffd0be-bd9b7e-7f6942-473b00 */
@theme {
  --color-dainty-peach: #ffd0be;
  --color-dainty-peach-50: #fff6f3;
  --color-dainty-peach-100: #ffeae2;
  --color-dainty-peach-200: #ffd0be;
  --color-dainty-peach-300: #e1bbac;
  --color-dainty-peach-400: #c49989;
  --color-dainty-peach-500: #a77d6d;
  --color-dainty-peach-600: #8a6253;
  --color-dainty-peach-700: #704c3e;
  --color-dainty-peach-800: #593a2d;
  --color-dainty-peach-900: #462b21;
  --color-dainty-peach-950: #2d1a12;
  --color-french-oak: #bd9b7e;
  --color-french-oak-50: #fff3e9;
  --color-french-oak-100: #fee7d4;
  --color-french-oak-200: #edd3bc;
  --color-french-oak-300: #d9bba2;
  --color-french-oak-400: #bd9b7e;
  --color-french-oak-500: #a08063;
  --color-french-oak-600: #84654a;
  --color-french-oak-700: #6b4f36;
  --color-french-oak-800: #553d27;
  --color-french-oak-900: #432e1c;
  --color-french-oak-950: #2a1c0e;
  --color-lizard: #7f6942;
  --color-lizard-50: #fff4e0;
  --color-lizard-100: #f9e9cf;
  --color-lizard-200: #e7d5b6;
  --color-lizard-300: #d3be9b;
  --color-lizard-400: #b59f78;
  --color-lizard-500: #9a835c;
  --color-lizard-600: #7f6942;
  --color-lizard-700: #66532f;
  --color-lizard-800: #514021;
  --color-lizard-900: #3f3116;
  --color-lizard-950: #281e0a;
  --color-alligator-gladiator: #473b00;
  --color-alligator-gladiator-50: #fdf6d8;
  --color-alligator-gladiator-100: #f4ecca;
  --color-alligator-gladiator-200: #e2d8b0;
  --color-alligator-gladiator-300: #cbc092;
  --color-alligator-gladiator-400: #ac9f6c;
  --color-alligator-gladiator-500: #8f824e;
  --color-alligator-gladiator-600: #736735;
  --color-alligator-gladiator-700: #5a4f21;
  --color-alligator-gladiator-800: #473b00;
  --color-alligator-gladiator-900: #352d0b;
  --color-alligator-gladiator-950: #211b04;
}