Espacement

Tokens Tailwind par défaut

Patrimo utilise l'échelle Tailwind CSS standard (rem based, incréments de 0.25 rem = 4 px). Aucune customisation dans tailwind.config.ts.

Échelle principale

Classe Tailwind	Valeur	Usage typique
p-0 / m-0	0	Reset
p-1	0.25 rem (4 px)	Padding interne très fin (badges sm)
p-1.5	0.375 rem (6 px)	Padding badges sm
p-2	0.5 rem (8 px)	Padding interne bouton compact, badge md
p-3	0.75 rem (12 px)	Padding interne nav item
p-4	1 rem (16 px)	Padding carte standard
p-5	1.25 rem (20 px)	Padding carte .card par défaut
p-6	1.5 rem (24 px)	Padding page (<main>)
p-8	2 rem (32 px)	Padding page lg+

Gaps (entre enfants)

Classe	Valeur	Usage
gap-2	8 px	Entre icône + label
gap-3	12 px	Entre inputs d'un formulaire compact
gap-4	16 px	Entre cartes d'une grille KPI
gap-6	24 px	Entre sections majeures d'une page

Layout vertical

Classe	Valeur	Usage
space-y-2	8 px	Liste de rows
space-y-4	16 px	Blocs d'une carte
space-y-6	24 px	Sections
space-y-8	32 px	Blocs majeurs de page

Règles

• Multiples de 4 : toujours (Tailwind l'impose, ne jamais passer en pixels custom)
• Ne pas mélanger m-3 p-5 sans raison — choisir une valeur cohérente par niveau hiérarchique
• Gouttières de page : p-6 lg:p-8 (responsive)
• Gap entre sections de page : space-y-6 ou space-y-8

Voir aussi

• Responsive — comportement des grilles
• Radius — rayons de bordure associés