Proportion

What proportion is

Proportion is the size relationship between elements on a Vaquum surface. It is the grid that governs everything spatial. Three values close the parameter: standard, print-large, and dense-app. Each declares four properties. The properties are a base unit, a closed set of vertical gaps, a content width, and a six-size type scale.

Three values

A standard surface uses the 8 px base unit, a gap set of 16, 24, and 64 px, and a 680 px publishing column. A print-large surface keeps the 8 px unit and the same gap set. Its content column matches an A4 or letter body, and its type scale rises by a step. A dense-app surface drops the base unit to 4 px and tightens its gaps to 12, 20, and 48 px; its content is fluid to the viewport width.

The 8 px base

Every spatial decision on a standard surface is an integer multiple of the base unit. Padding, margins, gaps, and rule offsets all snap to that grid. The closed set of vertical gaps reduces an open continuum to three permitted values, so two surfaces from one parameter read as members of one system. The bar diagram below shows the four canonical lengths read from @vaquum/face/parameters/proportion.

How proportion composes with rhythm

The proportion parameter sets the grid; the rhythm parameter governs how predictably the grid is followed. A surface declared rhythm: uniform must use one gap value for at least 80 percent of its sibling-to-sibling transitions. The named gap values exist so the rare exception has a name; a surface that introduces gap values outside the closed set declares rhythm: arrhythmic and earns a composition failure.