#>design
spacing model environmental response

Component Options / Spacing

Density & Measure

Spacing scales smoothly when driven by density attributes rather than hard-coded inline values.

Papergami cognitive layout study with calibrated metric ladders and proportional spaces.

Research note (for interns + designers): "rich" / high-density often compelling in business/inspection/tool contexts (high information per inch, registers, settings lists). "minimal" + roomy more useful for experiential/relationship reading (breathing room, calm presence). Use data-spw-density + data-spw-locality + data-spw-physics-reason in your own components for granular, vocabulary-building architecture. See /design/ bench and .spw page_architecture_vocabulary.

Three density tiers as padding, gap, and grid minimum Three stacked card outlines labeled dense, soft, and roomy. Each shows its padding inset as a dashed inner rectangle and its gap as a bracket between two blocks. Dense has the thinnest inset and bracket; roomy the widest. Beside each, the tokens it sets: component pad, component gap, and grid minimum. dense pad ↓ gap ↓ grid-min ↓ · registers, chips, settings lists soft the default cadence · prose and article blocks roomy pad ↑ gap ↑ grid-min ↑ · heroes, orientation, a pause in the scroll
Dashed inset is --component-pad; the space between the two blocks is --component-gap. A tier sets both plus --spw-grid-min-active. On a live page the packing runtime resolves the active tier per frame from measured occupancy, so a panel takes its frame's tier rather than a hard-coded one; the base tier lives in Settings.

Density: dense

High information per inch. Pads tightly and condenses line-height. Great for data registers, lists of settings, or tightly packed chips.

Density: soft

The default cadence. Provides comfortable breathing room for prose and general article blocks. Balances text measure against frame width.

Density: roomy

Expansive bounds for hero blocks, orientation frames, and introductory material. Creates a moment of pause inside the scroll.

Reading: measure

Caps the width to roughly 68ch (characters) for ideal reading of long-form prose, avoiding eye fatigue on wide screens.