Tokens

Design tokens

Copy-paste values for developers and designers building BBLC properties.

CSS variables

:root {
  --void:   #0B0C0F;
  --ink:    #111318;
  --carbon: #15171D;
  --border: #23262E;
  --text:   #F4F4F5;
  --muted:  #A1A6B0;
  --accent: #00D084;
  --coral:  #FF4B26;

  --font-display: 'Technor', Arial, sans-serif;
  --font-body:    'Inter', Arial, sans-serif;
  --font-mono:    'JetBrains Mono', monospace;

  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 48px;
  --space-2xl: 80px;
}

Spacing scale

--space-xs4px
--space-sm8px
--space-md16px
--space-lg24px
--space-xl48px
--space-2xl80px

Component specs

Primary button

Background #00D084, text #0B0C0F, padding 12px 24px, radius 8px, font-weight 600.

Card

Background #15171D, border #23262E, radius 12px, padding 24px.

Status badge

Uppercase JetBrains Mono, 12px, pill shape, border 1px rgba(255,255,255,.25).

Topbar

Fixed, backdrop blur, border-bottom #23262E, height 64px.

← DivisionsDownloads →