Elite Teal to Reptile Revenge Color Palette

About this palette

Elite Teal to Reptile Revenge is a 4-color dark palette: #193133 (Elite Teal), #3E4834 (Mountain View), #00130B (Jedi Night), #605628 (Reptile Revenge). It mixes gray, green, black, brown tones and feels balanced overall. The strongest text pairing is #00130B on #605628 with a contrast ratio of 2.60:1, and 0 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Elite Teal	rgb(25, 49, 51)	hsl(185, 34%, 15%)
Mountain View	rgb(62, 72, 52)	hsl(90, 16%, 24%)
Jedi Night	rgb(0, 19, 11)	hsl(155, 100%, 4%)
Reptile Revenge	rgb(96, 86, 40)	hsl(49, 41%, 27%)

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.

Color blindness preview

CSS variables

/* Elite Teal to Reptile Revenge — https://swatchly.xyz/palette/193133-3e4834-00130b-605628 */
:root {
  --elite-teal: #193133;
  --mountain-view: #3e4834;
  --jedi-night: #00130b;
  --reptile-revenge: #605628;
}

Tailwind CSS v4

/* Elite Teal to Reptile Revenge — https://swatchly.xyz/palette/193133-3e4834-00130b-605628 */
@theme {
  --color-elite-teal: #193133;
  --color-elite-teal-50: #e9f9fa;
  --color-elite-teal-100: #deeff1;
  --color-elite-teal-200: #c7dcde;
  --color-elite-teal-300: #afc6c8;
  --color-elite-teal-400: #8ca6a8;
  --color-elite-teal-500: #6f898b;
  --color-elite-teal-600: #556d70;
  --color-elite-teal-700: #3f5557;
  --color-elite-teal-800: #2e4142;
  --color-elite-teal-900: #193133;
  --color-elite-teal-950: #121d1d;
  --color-mountain-view: #3e4834;
  --color-mountain-view-50: #f1f8ea;
  --color-mountain-view-100: #e6eedf;
  --color-mountain-view-200: #d2dbc9;
  --color-mountain-view-300: #bbc5b1;
  --color-mountain-view-400: #9ba791;
  --color-mountain-view-500: #808c75;
  --color-mountain-view-600: #67715c;
  --color-mountain-view-700: #515b47;
  --color-mountain-view-800: #3e4834;
  --color-mountain-view-900: #303729;
  --color-mountain-view-950: #1d2218;
  --color-jedi-night: #00130b;
  --color-jedi-night-50: #eaf9f2;
  --color-jedi-night-100: #dff0e8;
  --color-jedi-night-200: #c9ddd4;
  --color-jedi-night-300: #b0c7bd;
  --color-jedi-night-400: #8fa89d;
  --color-jedi-night-500: #70897e;
  --color-jedi-night-600: #536b60;
  --color-jedi-night-700: #3c5147;
  --color-jedi-night-800: #293a32;
  --color-jedi-night-900: #1a2721;
  --color-jedi-night-950: #00130b;
  --color-reptile-revenge: #605628;
  --color-reptile-revenge-50: #fcf6db;
  --color-reptile-revenge-100: #f2eccd;
  --color-reptile-revenge-200: #e0d8b4;
  --color-reptile-revenge-300: #cbc298;
  --color-reptile-revenge-400: #ada375;
  --color-reptile-revenge-500: #918758;
  --color-reptile-revenge-600: #776d3f;
  --color-reptile-revenge-700: #605628;
  --color-reptile-revenge-800: #4b431e;
  --color-reptile-revenge-900: #3a3313;
  --color-reptile-revenge-950: #242008;
}