Spacing in Couldja creates rhythm, clarity, and hierarchy across the interface. This system is based on a consistent 4px unit.
Spacing Scale
--space-1
4px
--space-2
8px
--space-3
12px
--space-4
16px
--space-5
24px
--space-6
32px
--space-7
48px
--space-8
64px
Usage Examples
Card padding —
var(--space-4)
List item spacing —
var(--space-2)
Section spacing —
var(--space-5)
Guidelines
• Always use spacing tokens instead of arbitrary values.
• Prefer fewer, consistent spacing sizes across layouts.
• Smaller spacing communicates relationship; larger spacing communicates separation.
• Vertical rhythm is as important as horizontal alignment.