Olive Leaf to Evil Cigar Color Palette

About this palette

Olive Leaf to Evil Cigar is a 5-color dark, warm, earthy palette: #464B35 (Olive Leaf), #1B0608 (Noir Fiction), #431513 (English Breakfast), #4F684D (June Ivy), #5A1D00 (Evil Cigar). It mixes green, black, brown tones and feels warm overall. The strongest text pairing is #1B0608 on #4F684D with a contrast ratio of 3.18:1, and 0 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Olive Leaf	rgb(70, 75, 53)	hsl(74, 17%, 25%)
Noir Fiction	rgb(27, 6, 8)	hsl(354, 64%, 6%)
English Breakfast	rgb(67, 21, 19)	hsl(2, 56%, 17%)
June Ivy	rgb(79, 104, 77)	hsl(116, 15%, 35%)
Evil Cigar	rgb(90, 29, 0)	hsl(19, 100%, 18%)

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.18:1 Poor#1B0608 on #4F684D
Aa3.18:1 Poor#4F684D on #1B0608

Color blindness preview

CSS variables

/* Olive Leaf to Evil Cigar — https://swatchly.xyz/palette/464b35-1b0608-431513-4f684d-5a1d00 */
:root {
  --olive-leaf: #464b35;
  --noir-fiction: #1b0608;
  --english-breakfast: #431513;
  --june-ivy: #4f684d;
  --evil-cigar: #5a1d00;
}

Tailwind CSS v4

/* Olive Leaf to Evil Cigar — https://swatchly.xyz/palette/464b35-1b0608-431513-4f684d-5a1d00 */
@theme {
  --color-olive-leaf: #464b35;
  --color-olive-leaf-50: #f3f7e9;
  --color-olive-leaf-100: #e9eddd;
  --color-olive-leaf-200: #d5dac7;
  --color-olive-leaf-300: #c0c5af;
  --color-olive-leaf-400: #a1a78f;
  --color-olive-leaf-500: #878d75;
  --color-olive-leaf-600: #6e735c;
  --color-olive-leaf-700: #585d48;
  --color-olive-leaf-800: #464b35;
  --color-olive-leaf-900: #363a29;
  --color-olive-leaf-950: #222418;
  --color-noir-fiction: #1b0608;
  --color-noir-fiction-50: #fff1f2;
  --color-noir-fiction-100: #fbe5e6;
  --color-noir-fiction-200: #ead0d1;
  --color-noir-fiction-300: #d5b9ba;
  --color-noir-fiction-400: #b7999a;
  --color-noir-fiction-500: #98797b;
  --color-noir-fiction-600: #785c5d;
  --color-noir-fiction-700: #5c4344;
  --color-noir-fiction-800: #422f30;
  --color-noir-fiction-900: #2d1e1f;
  --color-noir-fiction-950: #1b0608;
  --color-english-breakfast: #431513;
  --color-english-breakfast-50: #fff2f0;
  --color-english-breakfast-100: #ffe4e1;
  --color-english-breakfast-200: #f9cbc6;
  --color-english-breakfast-300: #e6b2ad;
  --color-english-breakfast-400: #c9918b;
  --color-english-breakfast-500: #af7771;
  --color-english-breakfast-600: #945e59;
  --color-english-breakfast-700: #7b4a46;
  --color-english-breakfast-800: #653a36;
  --color-english-breakfast-900: #532d2a;
  --color-english-breakfast-950: #431513;
  --color-june-ivy: #4f684d;
  --color-june-ivy-50: #ebfae9;
  --color-june-ivy-100: #dff1de;
  --color-june-ivy-200: #cce0ca;
  --color-june-ivy-300: #b5cdb3;
  --color-june-ivy-400: #96b094;
  --color-june-ivy-500: #7c967a;
  --color-june-ivy-600: #647d62;
  --color-june-ivy-700: #4f684d;
  --color-june-ivy-800: #3c523b;
  --color-june-ivy-900: #2d3f2c;
  --color-june-ivy-950: #1b281a;
  --color-evil-cigar: #5a1d00;
  --color-evil-cigar-50: #fff2ed;
  --color-evil-cigar-100: #ffe5db;
  --color-evil-cigar-200: #ffcab5;
  --color-evil-cigar-300: #f0b097;
  --color-evil-cigar-400: #d48e73;
  --color-evil-cigar-500: #b87257;
  --color-evil-cigar-600: #9a583e;
  --color-evil-cigar-700: #7f432b;
  --color-evil-cigar-800: #66321d;
  --color-evil-cigar-900: #5a1d00;
  --color-evil-cigar-950: #351508;
}