# Best pricing blocks 2026: 41 verified sections

41 pricing blocks from 11 registries, each with a free preview and real source files. The table ranks them by file count and names every publisher.

> Page: https://ui.eneawork.it/blog/migliori-pricing-blocks-2026
> Markdown: https://ui.eneawork.it/blog/migliori-pricing-blocks-2026.md

*2026-11-01*

I migliori pricing block del 2026 sono i 41 che il catalogo indicizza in questa categoria, firmati da 11 registry e contati il 1 novembre 2026.

## Cosa si rompe quando il listino va online

In anteprima la sezione regge. In produzione la raggiungono tre cose che l'anteprima non simula: un listino che cambia, un cliente che paga in un'altra valuta e un test sul prezzo annuo. È lì che due file diventano un debito, perché la tariffa vive dentro il markup invece che in un dato. Il componente mostra il prezzo, non lo calcola.

## La tabella misurata

Le righe seguono il numero di file dichiarati dal registry. Due file vogliono dire sezione più card del piano; un file vuol dire componente unico. La colonna categoria segnala anche quando il publisher ha etichettato la sezione come custom: Custom Pricing e Custom Pricing Design Demo mostrano un prezzo a preventivo, non un listino, e la distinzione conta prima di adottarli.

## Quali dati leggere prima di scegliere

Tre letture vengono prima del colore. La prima è quanti piani dovrai mostrare oggi e tra sei mesi; la seconda è dove abita il prezzo, in una prop o in una costante; la terza è se il blocco possiede già il cambio di intervallo. Nessuna delle tre appare nell'anteprima, tutte e tre decidono se il lavoro finisce in un pomeriggio o in una settimana.

## Il limite che il catalogo non misura

La tabella conta i file, non le dipendenze. Un blocco a due file può trascinare un pacchetto di icone, un componente di switch o una libreria di animazioni, e quel costo non compare nella colonna. Prima di adottarlo apri la pagina del blocco e leggi il comando del registry: se installa più di due pacchetti oltre a quelli che hai già, la manutenzione supera il tempo risparmiato.

## La regola di decisione

Con tre piani, prezzi fissi e una sola valuta qualsiasi riga della tabella va bene: prendi il blocco da un file, passagli il prezzo e hai chiuso. Con un prezzo a consumo, più valute o uno sconto annuale calcolato, il blocco non è il punto di partenza: costruisci sopra un componente di tabella e usalo come riferimento visivo. La soglia è una sola, il calcolo: quando l'importo dipende da qualcosa che non è una costante, il markup non basta più.

## Blocco o primitiva: il confronto

L'alternativa da provare è comporre la sezione con Card, Badge e Button sui token del progetto. La prima volta costa un'ora invece di dieci minuti, e ripaga al secondo listino: nessun colore da rimappare, nessuna altezza da correggere, un solo componente di prezzo. Il blocco vince quando il design è deciso e non cambierà per un anno, come Pricing 01 di Shadcn Space; la primitiva vince quando il prezzo è un dato che si muove, come spiegato nella guida al pricing table in React.

curl "https://ui.eneawork.it/api/blocks/category/pricing?limit=10"

Il 1 novembre 2026 ho interrogato l'API del catalogo per la categoria pricing e contato i blocchi restituiti, raggruppandoli per registry e per file dichiarati. I totali della tabella sono quelli della risposta, non una stima: 41 sezioni, 11 publisher.

Il catalogo riporta la licenza dichiarata dal publisher, non una sua interpretazione. Un prezzo a preventivo e un listino hanno lo stesso testo di licenza ma usi commerciali diversi: verifica sul singolo blocco.

L'elenco intero vive in /blocks, filtrabile per categoria e fonte. Se ti interessa come il catalogo verifica ogni sezione, leggi la preview dei blocchi; se invece stai ancora decidendo da quale marketplace partire, il confronto tra 21st.dev e shadcnblocks mette a confronto licenze e numero di file.

## FAQ

### Quanti pricing block ci sono nel catalogo?

Sono 41, firmati da 11 registry e contati il 1 novembre 2026. La tabella mostra gli otto con più file.

### Posso collegare il prezzo a un'API invece di scriverlo nel componente?

Sì, se il blocco riceve l'importo come prop. Se il numero è una costante nel markup devi prima estrarre il dato, altrimenti il listino resta nel codice.

### Un blocco regge quattro piani?

Il numero di piani non entra nel conteggio dei file. Apri l'anteprima a 1280 pixel: se la quarta card va a capo, la sezione è pensata per tre piani.

### Serve una licenza commerciale per un blocco pricing?

La licenza la dichiara il publisher e il catalogo la riporta. Leggila sul singolo blocco: un uso gratuito su un sito vetrina non implica lo stesso permesso su un prodotto a pagamento.

### Come aggiungo l'imposta ai prezzi mostrati?

Calcola l'imponibile lato server e passa al componente il valore già formattato con Intl.NumberFormat. Se il blocco formatta da sé, sostituisci quella funzione, non il testo.