:root {
  /* Base colors */
  --background-light: rgb(242, 242, 247);
  --background-dark: rgb(28, 28, 30);
  --light-grey-light: rgb(199, 199, 204);
  --dark-grey-light: rgb(142, 142, 147);
  --light-grey-dark: rgb(142, 142, 147);
  --dark-grey-dark: rgb(72, 72, 74);

  /* Light mode colors */
  --red-light: rgb(255, 59, 48);
  --orange-light: rgb(255, 149, 0);
  --yellow-light: rgb(255, 204, 0);
  --green-light: rgb(52, 199, 89);
  --mint-light: rgb(0, 199, 190);
  --teal-light: rgb(48, 176, 199);
  --cyan-light: rgb(50, 173, 230);
  --blue-light: rgb(0, 122, 255);
  --indigo-light: rgb(88, 86, 214);
  --purple-light: rgb(175, 82, 222);
  --pink-light: rgb(255, 45, 85);
  --brown-light: rgb(165, 132, 94);

  /* Dark mode colors */
  --red-dark: rgb(255, 69, 58);
  --orange-dark: rgb(255, 159, 10);
  --yellow-dark: rgb(255, 214, 10);
  --green-dark: rgb(48, 209, 88);
  --mint-dark: rgb(102, 212, 207);
  --teal-dark: rgb(64, 200, 224);
  --cyan-dark: rgb(100, 210, 255);
  --blue-dark: rgb(10, 132, 255);
  --indigo-dark: rgb(94, 92, 230);
  --purple-dark: rgb(191, 90, 242);
  --pink-dark: rgb(255, 55, 95);
  --brown-dark: rgb(172, 142, 104);
}

/* Usage example:
   color: var(--red-light);
   background-color: var(--blue-dark);
*/