Foundations

Spacing

The live site mixes ad-hoc pixel values across margins, padding and gaps. This is a 4px-based scale normalized from the most common values observed, for consistent reuse going forward.

Scale

Do's and Don'ts

Reach for Tailwind's default spacing scale (which already steps in 4px increments — p-1 through p-16, etc.) instead of a one-off pixel value in bracket syntax.

·Snap every margin, padding and gap to the 4px scale.
·Use the same spacing value for visually related elements (e.g. all card padding) so rhythm stays consistent across the page.

Don't

·Don't reach for an arbitrary value like p-[13px] when a scale step is close enough.
·Don't treat this scale as fixed forever — it's normalized from ad-hoc values on the live site, so revisit it if a real pattern doesn't fit.