Spacing

Spacing tokens define the spacing system in the Persona Design System (PDS). They replace raw pixel values with reusable, named tokens that bring consistency to margins, padding, and layout across the product. All spacing in PDS is based on a 4px unit, which simplifies calculations and keeps designs aligned to a predictable rhythm.

Instead of hard-coding values like 12px or 20px, use space tokens. For example, a component might reference spacing[3] (12px) or spacing[6] (32px). By applying tokens, spacing scales consistently across designs and code, and changes can be made system-wide without manual rework.

Spacing tokens should be used whenever you’re defining layout, padding, or margin—whether inside PDS components or in custom product work. They ensure that all experiences remain visually balanced, predictable, and easy to maintain.