Spacing
Use Tailwind's spacing scale for a consistent rhythm. Start with the values below for each layout.
Common values
- Icon to text
gap-1.56px - Form label to field
gap-28px - Compact card padding
p-416px - Form field to field
gap-624px - Default card padding
p-624px - Page padding
p-6 md:p-832px - Section to section
gap-12 md:gap-1664px
Rules
Set gap-* on the parent to space flex or grid children.
Use shorthand such as p-4. Split the axes when a breakpoint changes only one.
Use --spacing(3) for custom spacing values to stay on the scale.
If more space doesn't clarify the grouping, use a divider or a surface.