Start generating

Go to Hell Black to Tropical Rainforest color palette

36291BGo to Hell Black4B4200Alligator Gladiator1E1D00Midnight Pines030D00Blackn’t00745BTropical Rainforest
Open in generator Export PNG, PDF, ASE…

About this palette

Go to Hell Black to Tropical Rainforest is a 5-color dark palette: #36291B (Go to Hell Black), #4B4200 (Alligator Gladiator), #1E1D00 (Midnight Pines), #030D00 (Blackn’t), #00745B (Tropical Rainforest). It mixes gray, brown, black, turquoise tones and feels balanced overall. The strongest text pairing is #030D00 on #00745B with a contrast ratio of 3.44:1, and 0 of its 10 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Go to Hell Blackrgb(54, 41, 27)hsl(31, 33%, 16%)
Alligator Gladiatorrgb(75, 66, 0)hsl(53, 100%, 15%)
Midnight Pinesrgb(30, 29, 0)hsl(58, 100%, 6%)
Blackn’trgb(3, 13, 0)hsl(106, 100%, 3%)
Tropical Rainforestrgb(0, 116, 91)hsl(167, 100%, 23%)

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.

  • Aa3.44:1 Poor#030D00 on #00745B
  • Aa3.44:1 Poor#00745B on #030D00

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Go to Hell Black to Tropical Rainforest — https://swatchly.xyz/palette/36291b-4b4200-1e1d00-030d00-00745b */
:root {
  --go-to-hell-black: #36291b;
  --alligator-gladiator: #4b4200;
  --midnight-pines: #1e1d00;
  --blackn-t: #030d00;
  --tropical-rainforest: #00745b;
}

Tailwind CSS v4

/* Go to Hell Black to Tropical Rainforest — https://swatchly.xyz/palette/36291b-4b4200-1e1d00-030d00-00745b */
@theme {
  --color-go-to-hell-black: #36291b;
  --color-go-to-hell-black-50: #fdf3e9;
  --color-go-to-hell-black-100: #f4e9de;
  --color-go-to-hell-black-200: #e2d5c8;
  --color-go-to-hell-black-300: #cdbeaf;
  --color-go-to-hell-black-400: #ad9d8d;
  --color-go-to-hell-black-500: #908070;
  --color-go-to-hell-black-600: #746556;
  --color-go-to-hell-black-700: #5b4e40;
  --color-go-to-hell-black-800: #453a2e;
  --color-go-to-hell-black-900: #36291b;
  --color-go-to-hell-black-950: #1f1912;
  --color-alligator-gladiator: #4b4200;
  --color-alligator-gladiator-50: #fbf7d6;
  --color-alligator-gladiator-100: #f2edc8;
  --color-alligator-gladiator-200: #e0d9ad;
  --color-alligator-gladiator-300: #cac390;
  --color-alligator-gladiator-400: #aba36b;
  --color-alligator-gladiator-500: #90874e;
  --color-alligator-gladiator-600: #756c34;
  --color-alligator-gladiator-700: #5d5521;
  --color-alligator-gladiator-800: #4b4200;
  --color-alligator-gladiator-900: #39330a;
  --color-alligator-gladiator-950: #231f03;
  --color-midnight-pines: #1e1d00;
  --color-midnight-pines-50: #f6f7e3;
  --color-midnight-pines-100: #ededd6;
  --color-midnight-pines-200: #d9dabf;
  --color-midnight-pines-300: #c3c3a5;
  --color-midnight-pines-400: #a4a483;
  --color-midnight-pines-500: #888866;
  --color-midnight-pines-600: #6d6d4d;
  --color-midnight-pines-700: #555538;
  --color-midnight-pines-800: #424128;
  --color-midnight-pines-900: #31311c;
  --color-midnight-pines-950: #1e1d00;
  --color-blackn-t: #030d00;
  --color-blackn-t-50: #eff9ea;
  --color-blackn-t-100: #e4efde;
  --color-blackn-t-200: #cfdcc8;
  --color-blackn-t-300: #b7c7b0;
  --color-blackn-t-400: #97a88f;
  --color-blackn-t-500: #76876e;
  --color-blackn-t-600: #586851;
  --color-blackn-t-700: #3f4d39;
  --color-blackn-t-800: #2b3526;
  --color-blackn-t-900: #1a2116;
  --color-blackn-t-950: #030d00;
  --color-tropical-rainforest: #00745b;
  --color-tropical-rainforest-50: #dafff1;
  --color-tropical-rainforest-100: #c1f7e4;
  --color-tropical-rainforest-200: #a2e4cd;
  --color-tropical-rainforest-300: #81ceb4;
  --color-tropical-rainforest-400: #56ae93;
  --color-tropical-rainforest-500: #329176;
  --color-tropical-rainforest-600: #00745b;
  --color-tropical-rainforest-700: #005c48;
  --color-tropical-rainforest-800: #004838;
  --color-tropical-rainforest-900: #00382b;
  --color-tropical-rainforest-950: #00231a;
}

Similar palettes