Chapter

Foundations

Tokens, type, color, space, and structural foundations.

Introduction

Foundations define tokens for color, type, space, borders, and focus. They support calm product UI without decorative noise.

Tokens

Use shared CSS variables for light and dark themes. Prefer semantic names over raw values in components and patterns.

Space and hierarchy

Spacing rhythm and type scale create hierarchy before color accents. Emptiness is intentional.