@salesforce-ux/design-tokens/dist/themes/cosmos/cosmos.reference.tokens.css

Salesforce Design System Tokens & Styling Hooks

/**
 * Do not edit directly, this file was auto-generated.
 */

:root, .slds-theme_cosmos {
  --slds-r-color-brand-5: #000314;
  --slds-r-color-brand-10: #001642;
  --slds-r-color-brand-15: #001e5b;
  --slds-r-color-brand-20: #002775;
  --slds-r-color-brand-30: #022ac0;
  --slds-r-color-brand-35: #003ecd;
  --slds-r-color-brand-40: #0250d9;
  --slds-r-color-brand-45: #045dec;
  --slds-r-color-brand-50: #066afe;
  --slds-r-color-brand-55: #287efe;
  --slds-r-color-brand-60: #4992fe;
  --slds-r-color-brand-65: #5f9ffe;
  --slds-r-color-brand-70: #7cb1fe;
  --slds-r-color-brand-80: #a8cbff;
  --slds-r-color-brand-85: #c2daff;
  --slds-r-color-brand-90: #d6e6ff;
  --slds-r-color-brand-95: #edf4ff;
  --slds-r-color-info-5: #000310;
  --slds-r-color-info-10: #001639;
  --slds-r-color-info-15: #03234d;
  --slds-r-color-info-20: #032d60;
  --slds-r-color-info-30: #014486;
  --slds-r-color-info-35: #044f98;
  --slds-r-color-info-40: #0b5cab;
  --slds-r-color-info-45: #0469c1;
  --slds-r-color-info-50: #0176d3;
  --slds-r-color-info-55: #0684ef;
  --slds-r-color-info-60: #1b96ff;
  --slds-r-color-info-65: #57a3fd;
  --slds-r-color-info-70: #78b0fd;
  --slds-r-color-info-80: #aacbff;
  --slds-r-color-info-85: #c2d8ff;
  --slds-r-color-info-90: #d8e6fe;
  --slds-r-color-info-95: #eef4ff;
  --slds-r-color-success-5: #010502;
  --slds-r-color-success-10: #071b12;
  --slds-r-color-success-15: #072825;
  --slds-r-color-success-20: #023434;
  --slds-r-color-success-30: #024d4c;
  --slds-r-color-success-35: #035a58;
  --slds-r-color-success-40: #056764;
  --slds-r-color-success-45: #087570;
  --slds-r-color-success-50: #0b827c;
  --slds-r-color-success-55: #09948b;
  --slds-r-color-success-60: #06a59a;
  --slds-r-color-success-65: #03b4a7;
  --slds-r-color-success-70: #01c3b3;
  --slds-r-color-success-80: #04e1cb;
  --slds-r-color-success-85: #76ead9;
  --slds-r-color-success-90: #acf3e4;
  --slds-r-color-success-95: #def9f3;
  --slds-r-color-error-5: #0f0003;
  --slds-r-color-error-10: #370114;
  --slds-r-color-error-15: #4b0620;
  --slds-r-color-error-20: #61022a;
  --slds-r-color-error-30: #8a033e;
  --slds-r-color-error-35: #a00449;
  --slds-r-color-error-40: #b60554;
  --slds-r-color-error-45: #ce055f;
  --slds-r-color-error-50: #e3066a;
  --slds-r-color-error-55: #f42f7c;
  --slds-r-color-error-60: #ff538a;
  --slds-r-color-error-65: #fe7298;
  --slds-r-color-error-70: #fe8aa7;
  --slds-r-color-error-80: #fdb6c5;
  --slds-r-color-error-85: #fec8d4;
  --slds-r-color-error-90: #fddde3;
  --slds-r-color-error-95: #fef0f3;
  --slds-r-color-warning-5: #090200;
  --slds-r-color-warning-10: #281202;
  --slds-r-color-warning-15: #371e03;
  --slds-r-color-warning-20: #4f2100;
  --slds-r-color-warning-30: #6f3400;
  --slds-r-color-warning-35: #824308;
  --slds-r-color-warning-40: #8c4b02;
  --slds-r-color-warning-45: #9a5803;
  --slds-r-color-warning-50: #a96504;
  --slds-r-color-warning-55: #ba7503;
  --slds-r-color-warning-60: #ca8501;
  --slds-r-color-warning-65: #da9401;
  --slds-r-color-warning-70: #e4a201;
  --slds-r-color-warning-80: #fcc003;
  --slds-r-color-warning-85: #f8d462;
  --slds-r-color-warning-90: #f9e3b6;
  --slds-r-color-warning-95: #fbf3e0;
}