CSS Variables

CSS custom properties · :root scope · 87 tokens

Preview

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

:root {
  /* Colors */
  --color-colors-gray0: #ffffff;
  --color-colors-gray4: #999999;
  --color-colors-gray5: #696969;
  --color-colors-gray6: #333333;
  --color-colors-gray7: #000000;
  --color-colors-red2: #DFBEBE;
  --color-colors-red3: #B93D3D;
  --color-colors-green2: #B4D6B3;
  --color-colors-green3: #238020;
  --color-colors-blue1: #EBECF7;
  --color-colors-blue2: #3D46C2;
  --color-colors-blue3: #00075F;
  --color-colors-foregroundshadow: rgba(0, 0, 0, 0.08);
  --color-colors-foregroundlight: rgba(0, 0, 0, 0.6);
  --color-colors-foregroundheavy: rgba(0, 0, 0, 0.85);
  --color-colors-backgroundshadow: rgba(255, 255, 255, 0.08);
  --color-colors-backgroundlight: rgba(247, 247, 247, 0.6);
  --color-colors-backgroundheavy: rgba(255, 255, 255, 0.95);
  --color-colors-alert: #E15100;
  --color-colors-notification: #A87253;

  /* Typography */
  --font-size-areal-16px-400: 16px;
  --font-size-areal-12-5px-400: 12.5px;
  --font-size-areal-19-2px-400: 19.2px;
  --font-size-areal-10px-600: 10px;
  --font-size-areal-14-4px-700: 14.4px;

  /* Spacing */
  --spacing-2px: 2px;
  --spacing-5px: 5px;
  --spacing-6px: 6px;
  --spacing-7px: 7px;
  --spacing-10px: 10px;
  --spacing-15px: 15px;
  --spacing-20px: 20px;
…