Tailwind vs Bootstrap: cosa cambia davvero

Tailwind e Bootstrap risolvono due problemi diversi: Bootstrap porta componenti pronti, Tailwind porta le utility per scriverli. Se il sito ha bisogno di un’identità visiva propria vince Tailwind; se serve una dashboard interna in una settimana vince Bootstrap.

La differenza si misura in byte e in righe da scrivere. Il CSS minificato completo di Bootstrap 5 pesa 232.108 byte, letto dalla CDN il 1 novembre 2026. Il record Bootstrap del catalogo EneUI raccoglie 13 file sorgente per 50.755 byte, mentre il record shadcn/ui ne raccoglie 61 per 242.735.

Cosa arriva con l’installazione

Il peso è una decisione, non un numero

Bootstrap consegna un foglio di stile completo: griglia, tipografia, form, utility e componenti. È un vantaggio quando usi quella superficie e un costo quando ne usi un decimo. La build Sass permette di rimuovere moduli, ma la mappa delle dipendenze tra partial va conosciuta.

Tailwind genera solo le classi che compaiono nei file scansionati. Il file finale parte da pochi kilobyte e cresce con il progetto, mentre il CSS di Bootstrap parte da 232.108 byte e scende con la configurazione. Il confronto tra due numeri singoli non dice nulla: conta la superficie che usi davvero.

# il CSS completo di Bootstrap 5, misurato dalla CDN
curl -s https://cdn.jsdelivr.net/npm/bootstrap@5/dist/css/bootstrap.min.css | wc -c

# il CSS che Tailwind genera dal tuo progetto
npx @tailwindcss/cli -i ./src/app.css -o ./dist/app.css --minify
wc -c ./dist/app.css

# quante classi Bootstrap restano nelle pagine
rg -o "btn|col-|navbar|modal" src --glob "*.tsx" | wc -l

Il terzo comando è il cruscotto della migrazione: il numero deve scendere a ogni pagina convertita. Quando arriva a zero, Bootstrap può uscire dal progetto senza un big bang.

Dove Bootstrap vince ancora

Bootstrap ha 102.655 domande su Stack Overflow, dieci volte il tag `tailwind-css`. Quel numero misura l’installato, non la qualità: significa che ogni dubbio su griglia, breakpoint e navbar ha già una risposta pubblica. Per un team che consegna una dashboard a un cliente, quella documentazione vale più dell’eleganza delle utility.

Il limite da mettere per iscritto

Limite dichiarato di Tailwind: non porta componenti né comportamento. Modal, dropdown, tooltip e menu accessibili vanno riscritti su primitive headless, e quel lavoro non è incluso nella conversione delle classi. I 1.556 blocchi del catalogo EneUI accorciano la strada, ma 1.459 dichiarano «see source» come licenza: la licenza va verificata prima di pubblicare.

Licenze e dipendenze

Bootstrap è MIT e Tailwind è MIT, quindi la licenza non decide. Decide il lavoro di comportamento: se il sito usa cinque plugin Bootstrap, la migrazione costa più della parte CSS. La licenza dei blocchi copiati è un secondo controllo, separato da quello della libreria.

Il punto di partenza è /components/lib/bootstrap, l’arrivo è /components/lib/shadcn e le utility si esplorano in /components/cat/tailwind. Per capire il modello prima di convertire leggi che cos’è Tailwind CSS e la migrazione in tre fasi in da Bootstrap a Tailwind; il confronto misurato tra librerie è in React UI libraries 2026.