# Studio design system

> Shared controls, typography, surfaces and focused project workspaces.

Canonical: https://svavarstudio.com/design-system
Updated: 2026-10-03

The studio uses the original white project composer as its visual reference. Shared semantic tokens define color, typography, spacing, elevation and focus. Action and icon controls use a 44-pixel minimum target, a 10-pixel corner radius and consistent 18-pixel Lucide icons. Surfaces use 16- or 24-pixel corners according to their purpose.

Rift House has a focused workspace with Images, Films, Drawings, 3D model and Assembly views. Its four images use a short horizontal strip; films use one inline player with a film selector. Drawings are grouped into plans and sections, axons, and architectural details, with one drawing displayed at a time. The model and assembly have dedicated stages. The model retains assembly, section, daylight, shadow, camera lens and surface controls.

The other project collections use horizontal media strips. Swipe, use the previous and next buttons, select a named view, or focus a strip and use arrow keys. Images retain their native proportions, including portrait studies. Reduced motion and keyboard focus are supported.

The interactive reference demonstrates action states, grouped choices, sliders, form fields, type scale, surfaces and the same project strip used by the portfolio.
