Spacing Theme
Spacing
Spatial rhythm and independently authorable spacing relationships that control the density and separation of QP compositions. Enum values are authored vocabulary; System values are framework-owned truths; Roots are independent semantic theme decisions. Derived and Inherited variables remain available through Theme search and linked variable families.
Roots
--qp-space-md
Choose the base unit that controls QP’s overall spatial density.
10 Derived variables; 34 Inherited variables
1rem
--qp-control-padding-block-sm
Choose the compact block-axis density used by navigation, search, and similar controls.
0 Derived variables; 3 Inherited variables
0.625rem
--qp-control-padding-block-md
Choose the ordinary block-axis density used by action controls and control-like bars.
1 Derived variable; 2 Inherited variables
0.7rem
--qp-control-padding-inline
Choose the standard horizontal breathing room for compact navigation, search, and TOC controls.
0 Derived variables; 3 Inherited variables
0.75rem
--qp-surface-padding-inline
Choose the default responsive inline safe area inside major QP surfaces.
0 Derived variables; 4 Inherited variables
clamp(1rem, 4vw, 2rem)
--qp-cta-padding-inline
Choose the horizontal emphasis and label breathing room of CTA controls.
0 Derived variables; 0 Inherited variables
1.1rem
--qp-menu-gap
Choose the density of top-level navigation items without changing their clickable padding.
0 Derived variables; 0 Inherited variables
0.375rem
--qp-menu-nested-gap
Choose the separation between entries in a nested navigation hierarchy.
0 Derived variables; 0 Inherited variables
0.125rem
--qp-menu__mobile-link-padding-block
Choose mobile navigation touch density independently from compact desktop controls.
0 Derived variables; 0 Inherited variables
0.75rem
--qp-menu__mobile-list-margin
Choose how the expanded mobile navigation panel separates from header content.
0 Derived variables; 0 Inherited variables
0.75rem auto 0
--qp-footer-margin-top
Choose whether the Footer is separated from the document or attached to the preceding surface.
0 Derived variables; 0 Inherited variables
4rem
--qp-site-header-padding-block
Choose the SiteHeader’s vertical density and overall bar height.
0 Derived variables; 0 Inherited variables
0.75rem
--qp-toast-padding
Choose the density and prominence of transient Toast messages.
0 Derived variables; 0 Inherited variables
.75rem 1rem