:where(html) {
  --brand-color-anthracite-0: #181d1e;
  --brand-color-anthracite-1: #1c2223;
  --brand-color-anthracite-2: #262b2c;
  --brand-color-anthracite-3: #2d3132;
  --brand-color-anthracite-4: #303a3d;
  --brand-color-anthracite-5: #33454f;
  --brand-color-anthracite-6: #647a84;

  --brand-color-blue: #24353f;

  --brand-color-orange-0: #ed6a12;
  --brand-color-orange-1: #f18841;
  --brand-color-orange-2: #f6ac6f;
  --brand-color-orange-3: #f8ede6;

  --brand-color-white-0: white;
  --brand-color-white-1: #f4f2ef;
  --brand-color-white-2: #ebeae8;

  /**
    Alias Names for Styleguide
   */
  --primary-brand-color-anthracite: var(--brand-color-anthracite-0);
  --primary-brand-color-blue: var(--brand-color-blue);
  --primary-brand-color-orange: var(--brand-color-orange-0);
  --primary-brand-color-white: var(--brand-color-white-0);

  /**
    Gray Tones, main usage for forms
   */
  --brand-color-gray-coal: #363636;
  --brand-color-gray-carbon: #444444;
  --brand-color-gray-graphite: #717171;
  --brand-color-gray-cement: #999999;
  --brand-color-gray-stone: #b5b5b5;
  --brand-color-gray-silver: #c0c0c0;
  --brand-color-gray-steel: #cccccc;
  --brand-color-gray-plumb: #dddddd;
  --brand-color-gray-ash: #e5e5e5;
  --brand-color-gray-smoke: #eeeeee;
  --brand-color-gray-chalk: #f5f5f5;

  /**
    Functional Colors
   */
  --functional-color-success-0: #27ae60;
  --functional-color-success-1-light: #d4efdf;
  --functional-color-success-1-dark: #1b3b2b;

  --functional-color-attention-0: #f5a323;
  --functional-color-attention-1-light: #fdeddd;
  --functional-color-attention-1-dark: #2e2a1e;

  --functional-color-error-0: #e83623;
  --functional-color-error-1-light: #fef5f4;
  --functional-color-error-1-dark: #40221f;
}