_color.css

:root {
  
  /* --------------- THEME COLORS --------------- */
  
  --theme-color__primary: #9D6D45;
  --theme-color__primary--light: #AA764B;
  --theme-color__primary--dark: #1D140D;

  --theme-color__supporting-1: #56ee9d;
  --theme-color__supporting-1--light: #99FBC7;
  --theme-color__supporting-1--dark: #4DD48C;

  --theme-color__supporting-2: #817e9f;
  --theme-color__supporting-2--light: #BFBBEB;
  --theme-color__supporting-2--dark: #6C6A85;

  --theme-color__accent: #78fbfb;
  --theme-color__accent--lightest: #f0f8ff;

  /* --------------- GRAYSCALE --------------- */
  
  --color__white: #FFFFFF;
  --color__gray--100: #EAEAEA;
  --color__gray--300: #B2B2B2;
  --color__gray--700: #595959;
  --color__gray--800: #4D4C4C;
  --color__black: #000000;

  /* --------------- MISC COMMON COLORS --------------- */
  
  --color__page-background: var(--color__gray--700);
  --color__text--light-on-dark: var(--color__gray--100);
  
  --color__box-shadow: hsla(0, 0%, 0%, 0.43);
}