Referentiesize

Referentiesize, in Dutch typography and user interface design, denotes the reference or baseline font size from which other sizes are derived. It provides a common scale for sizing elements such as body text, headings, and captions to ensure consistency and readability across a design.

In practice, referentiesize is often the root font size defined on the root element of a document, typically in CSS. When the root font size is set, relative units such as rem (root em) derive their values from that reference. If the referentiesize is 16 pixels, a 1.25rem heading evaluates to 20 pixels. Em units, by contrast, derive from the font size of the element they are applied to, which can lead to compounding effects.

The concept is central to responsive and accessible design. By choosing a clear referentiesize and using a modular typographic scale (for example multiplying or dividing by a constant factor), designers can adjust sizing more predictably for different devices or user preferences. Users who increase their browser’s default text size effectively change the referentiesize, influencing all rem-based measurements and improving legibility for those with visual impairments.

While often discussed in the context of CSS, the referentiesize also appears in print typography as the baseline measure (for instance, 12pt or 10pt) used to compute a coherent hierarchy of text sizes. Overall, the referentiesize is a foundational concept that supports consistency, scalability, and accessibility in typography and design.