CSS Variables

CSS custom properties · :root scope · 108 tokens

Preview

/* Generated by UI Archive — ui-archive.com */

:root {
  /* Colors */
  --color-r-globalnav-background-opened: #fafafc;
  --color-sk-focus-color: #0071e3;
  --color-sk-focus-color-alt: #000000;
  --color-sk-body-link-color: #0066cc;
  --color-sk-glyph-gray-alpha: rgba(0, 0, 0, 0.88);
  --color-sk-glyph-gray-secondary: #6e6e73;
  --color-sk-glyph-gray-secondary-alpha: rgba(0, 0, 0, 0.56);
  --color-sk-glyph-gray-secondary-alt: #424245;
  --color-sk-glyph-gray-secondary-alt-alpha: rgba(0, 0, 0, 0.72);
  --color-sk-glyph-gray-tertiary-alpha: rgba(0, 0, 0, 0.48);
  --color-sk-glyph-orange: #b64400;
  --color-sk-glyph-green: #008009;
  --color-sk-glyph-red: #e30000;
  --color-sk-fill-gray-tertiary-alpha: rgba(0, 0, 0, 0.16);
  --color-sk-fill-gray-quaternary-alpha: rgba(0, 0, 0, 0.08);
  --color-sk-fill-orange: #f56300;
  --color-sk-fill-green: #03a10e;
  --color-sk-fill-green-secondary: #f5fff6;
  --color-sk-fill-yellow: #ffe045;

  /* Typography */
  --font-size-sf-pro-text: 12px;
  --font-size-sf-pro-display: 28px;
  --font-size-sf-pro-text-2: 17px;
  --font-size-sf-pro-display-2: 19px;
  --font-size-sf-pro-display-3: 24px;
  --font-size-sf-pro-text-7: 14px;
  --font-size-sf-pro-display-5: 21px;
  --font-size-sf-pro-icons: inherit;
  --font-size-sf-pro-text-44px-400: 44px;
  --font-size-sf-pro-display-40px-600: 40px;
  --font-size-sf-pro-text-18px-300: 18px;
  --font-size-sf-pro-text-25-5px-600: 25.5px;

  /* Spacing */
  --spacing-2px: 2px;
…