2026 · 02 · 25 · 5 min
Come organizzo il CSS in progetti grandi
Dopo anni di BEM, utility classes e CSS-in-JS, sono tornato al CSS custom properties puro. Ecco la struttura che uso su ogni progetto e perché funziona meglio di tutto il resto.
▞ ▚ ▞ ▚ ▞ ▚ ▞ ▚ ▞ ▚
La struttura base: un file globals.css con i token (colori, spaziature, tipografia), un file per ogni componente principale, nessun file di utility.
I token hanno nomi semantici, non descrittivi. --color-primary, non --color-blue. Questo permette di cambiare il tema senza toccare i componenti.
Per i componenti uso una convenzione BEM semplificata: .card, .card-header, .card--featured. Nessun nesting profondo.
La regola d'oro: se un file CSS supera 200 righe, va diviso. Se un selettore ha più di 3 livelli di specificità, va riscritto.
CSSArchitecture