Skip to content

Foundations

The token layer. Every component draws from these — change a token in src/styles.css and the whole suite follows.

Semantic colours

background

foreground

card

primary

secondary

muted

accent

destructive

border

Per-product accents

Logica ERP

Logica Visi

Logica Spatia

Logica Flow

Type scale

The quick brown foxDisplay
The quick brown foxHeading
The quick brown foxTitle
The quick brown foxBody
The quick brown foxSmall

Radii

Corner radius scale

rounded-sm

rounded-md

rounded-lg

rounded-xl