Skip to content
SmarterDx Hub

Layout

One container, one side gutter, and Deep Space to break the page.

Only two layout tokens exist. --container-full is 1440px. --side-space is 2vw on base and 4vw on mobile — the only token in the entire system that varies by mode; every colour and font token is mode-invariant. Rhythm on the live site comes from alternating white sections against Deep Space 1 grounds, not from a numeric spacing scale.

Container

1440px

Site variable --container-full. One width; no secondary container token is published.

Side gutter

2vw / 4vw

Site variable --side-space, base and mobile. The system's only mode-varying token.

Spacing scale

Not tokenised

No spacing scale exists as variables. Use even, generous rhythm; do not invent a numeric scale and present it as client canon.

Radius — per component, not tokenised

Measured off the shipped build: 21.6px platform cards, 15px and 12px content cards, ~7px buttons, 999px pills, 50% avatars.

Platform card gradient · 21.6px
Card face gradient · 21.6px
Gradients — descriptive, not signed off

The client has never published gradient stop values. These are read off the shipped build, so they describe what ships rather than a spec:

  • --platform-card
    linear-gradient(90deg, rgba(2,87,255,.25) 0%, rgba(0,200,226,.25) 38.25%, rgba(103,74,249,.25) 100%)
  • --card-face
    linear-gradient(156deg, #D5FAFF 14.6%, #E0EBFF 85.4%)