CSS Variables

Preview

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

:root {
  /* Colors */
  --color-foreground: hsl(0, 0%, 100%);
  --color-background: hsl(250, 24%, 9%);
  --color-secondarybg: hsl(250, 21%, 11%);
  --color-agents-sheet: #000000;
  --color-agents-scrim: rgb(13 12 20 / 0.7);
  --color-agents-band: #1C1A29;
  --color-agents-raised: #252134;
  --color-agents-edge: #312C45;
  --color-agents-ink: #B3B3E6;
  --color-agents-dim: #5E5C86;
  --color-agents-accent: #A78BFE;
  --color-agents-link: #B9A3D8;
  --color-agents-good: #22C55E;
  --color-agents-shade: rgb(0 0 0 / 0.5);
  --color-blue-50: hsl(220, 55%, 10%);
  --color-blue-100: hsl(220, 55%, 13%);
  --color-blue-200: hsl(220, 62%, 25%);
  --color-blue-300: hsl(220, 68%, 35%);
  --color-blue-400: hsl(220, 72%, 45%);
  --color-blue-500: hsl(220, 80%, 55%);
  --color-blue-600: hsl(220, 80%, 65%);
  --color-blue-700: hsl(220, 80%, 75%);
  --color-blue-800: hsl(220, 80%, 85%);
  --color-blue-900: hsl(220, 80%, 95%);

  /* Typography */
  --font-size-inter-16px-400: 16px;
  --font-size-jetbrains-mono-12px-400: 12px;
  --font-size-inter-14px-400: 14px;
  --font-size-inter-18px-400: 18px;
  --font-size-inter-40px-700: 40px;
  --font-size-inter-13-3333px-600: 13.3333px;
  --font-size-inter-20px-400: 20px;
  --font-size-ibm-plex-serif-36px-400: 36px;
  --font-size-ibm-plex-serif-54px-500: 54px;

…

All Tokens