Tempio Docs
Design system

Design system

Mode

The design system lives in packages/ui (@tempio/ui). Everything on these pages renders from the package itself: tokens from styles/tokens.css, components from components/ui.

The colours, type, gradients and patterns come from Softriver’s brand kit, delivered on Sep 14: the purple primary, the dark neutral sidebar (the design walk of Oct 10 moved it off the purple), the white paper, the purple-tinted dark ground, and Geist at Medium 500. Gradients shows the three gradient tokens and where each may appear, Patterns the seven kit patterns in their three placements, and Icons the Lucide glyphs that play on hover and on a state change.

Spec: docs/superpowers/specs/2026-09-23-design-system-v3-design.md, which puts the kit on the v2 system (2026-08-22-design-system-v2-design.md).

CLI

Install the Tempio CLI, sign in with an MCP key, run any capability as a command, pipe the answer into another program, and branch on the exit code.

Brand

The arch mark, wordmark, gradient, grounds and files.