PCB Green to Tuscan Color Palette

About this palette

PCB Green to Tuscan is a 5-color warm, earthy palette: #072900 (PCB Green), #604600 (Very Coffee), #C5BB00 (Mustard), #7E7B00 (Olive), #FFD3A5 (Tuscan). It mixes green, brown, yellow, orange tones and feels warm overall. The strongest text pairing is #072900 on #FFD3A5 with a contrast ratio of 11.40:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
PCB Green	rgb(7, 41, 0)	hsl(110, 100%, 8%)
Very Coffee	rgb(96, 70, 0)	hsl(44, 100%, 19%)
Mustard	rgb(197, 187, 0)	hsl(57, 100%, 39%)
Olive	rgb(126, 123, 0)	hsl(59, 100%, 25%)
Tuscan	rgb(255, 211, 165)	hsl(31, 100%, 82%)

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.

Aa11.40:1 Very good#072900 on #FFD3A5
Aa11.40:1 Very good#FFD3A5 on #072900
Aa7.90:1 Very good#072900 on #C5BB00
Aa7.90:1 Very good#C5BB00 on #072900
Aa6.37:1 Good#604600 on #FFD3A5
Aa6.37:1 Good#FFD3A5 on #604600
Aa4.42:1 Poor#604600 on #C5BB00
Aa4.42:1 Poor#C5BB00 on #604600

Color blindness preview

CSS variables

/* PCB Green to Tuscan — https://swatchly.xyz/palette/072900-604600-c5bb00-7e7b00-ffd3a5 */
:root {
  --pcb-green: #072900;
  --very-coffee: #604600;
  --mustard: #c5bb00;
  --olive: #7e7b00;
  --tuscan: #ffd3a5;
}

Tailwind CSS v4

/* PCB Green to Tuscan — https://swatchly.xyz/palette/072900-604600-c5bb00-7e7b00-ffd3a5 */
@theme {
  --color-pcb-green: #072900;
  --color-pcb-green-50: #e7fde1;
  --color-pcb-green-100: #dbf4d5;
  --color-pcb-green-200: #c4e1bd;
  --color-pcb-green-300: #abcca3;
  --color-pcb-green-400: #89ad80;
  --color-pcb-green-500: #6d9265;
  --color-pcb-green-600: #54774c;
  --color-pcb-green-700: #406038;
  --color-pcb-green-800: #304c29;
  --color-pcb-green-900: #233b1d;
  --color-pcb-green-950: #072900;
  --color-very-coffee: #604600;
  --color-very-coffee-50: #fff4de;
  --color-very-coffee-100: #fce9c4;
  --color-very-coffee-200: #ebd5a9;
  --color-very-coffee-300: #d8bf8e;
  --color-very-coffee-400: #bca169;
  --color-very-coffee-500: #a3874c;
  --color-very-coffee-600: #896e33;
  --color-very-coffee-700: #725820;
  --color-very-coffee-800: #604600;
  --color-very-coffee-900: #4a3606;
  --color-very-coffee-950: #302201;
  --color-mustard: #c5bb00;
  --color-mustard-50: #f8f4a7;
  --color-mustard-100: #ede990;
  --color-mustard-200: #dad367;
  --color-mustard-300: #c5bb00;
  --color-mustard-400: #a59d00;
  --color-mustard-500: #8a8300;
  --color-mustard-600: #706a00;
  --color-mustard-700: #595500;
  --color-mustard-800: #474300;
  --color-mustard-900: #383400;
  --color-mustard-950: #232000;
  --color-olive: #7e7b00;
  --color-olive-50: #f9f9c5;
  --color-olive-100: #f1f2b8;
  --color-olive-200: #e1e19c;
  --color-olive-300: #cdcc7d;
  --color-olive-400: #b0af53;
  --color-olive-500: #97942f;
  --color-olive-600: #7e7b00;
  --color-olive-700: #646100;
  --color-olive-800: #4e4c00;
  --color-olive-900: #3b3a00;
  --color-olive-950: #252400;
  --color-tuscan: #ffd3a5;
  --color-tuscan-50: #fff7ee;
  --color-tuscan-100: #ffebd7;
  --color-tuscan-200: #ffd3a5;
  --color-tuscan-300: #e1bd98;
  --color-tuscan-400: #c49c72;
  --color-tuscan-500: #a87f54;
  --color-tuscan-600: #8b643a;
  --color-tuscan-700: #704e26;
  --color-tuscan-800: #593b18;
  --color-tuscan-900: #462d0e;
  --color-tuscan-950: #2d1b05;
}