Migliori logo blocks 2026: 74 sezioni verificate

Una sezione logo è una prova sociale: dice che qualcuno si fida di te prima che il visitatore legga una testimonianza. Il catalogo ne conta 74 da 5 registry, misurate il 1 novembre 2026, e quasi tutte sono varianti di logo cloud, cioè la fascia di marchi subito sotto la hero.

Quello che si rompe non è il disegno: è il caricamento. Quaranta loghi in PNG, ognuno senza width e height, producono uno spostamento cumulativo che spinge in basso tutto il contenuto; un marquee che scorre senza pausa rende impossibile leggere i nomi e non si ferma per chi ha impostato la riduzione del movimento; un filtro in scala di grigi applicato a un logo già scuro lo fa sparire in tema scuro.

Perché una logo cloud sposta la pagina

Il layout shift nasce quando il browser non conosce le proporzioni dell’immagine: riserva zero altezza, disegna il testo sotto e poi sposta tutto quando il file arriva. Con sei loghi il difetto è invisibile su una connessione veloce; con quindici su 4G diventa un salto visibile e un punteggio CLS compromesso. La correzione non è nel blocco: è dichiarare width e height, oppure usare un SVG inline che occupa spazio dal primo render.

76 file e 176 registry dependency

I 74 blocchi sommano 76 file, cioè 1,0 per sezione, con 16 sezioni multi-file. Le dipendenze npm sono soltanto 5 in tutta la categoria, mentre le registry dependency arrivano a 176, cioè 2,4 per blocco: il peso non è nei pacchetti, è nei componenti shadcn che il blocco richiede per far scorrere la fascia, gestire gli hover o ritagliare i loghi su mobile. Un blocco che chiede marquee, card e tooltip porta tre componenti per mostrare sei immagini.

• Registry dependency: un marquee animato richiede più componenti di una griglia statica.
• Formato: SVG inline si colora con currentColor, un PNG no e va preparato in due versioni.
• Numero di loghi: sopra i dodici la griglia statica non regge, sotto è la scelta più leggera.
• Licenza: le 74 righe rimandano al repository, e i marchi mostrati non sono coperti dal codice.

La tabella, ordinata per file

Quasi tutte le righe si chiamano Logo Cloud e vengono da elements: la tabella misura quante variazioni dello stesso schema esistono, non quante idee diverse. Le righe di Shadcn UI Blocks hanno nomi numerati e sono più utili per confrontare il numero di loghi gestiti, perché la variante è dichiarata nel titolo.

Cosa guardare in una logo cloud

Apri la preview con il tema scuro e conta quanti loghi restano leggibili: se il blocco applica opacity o un filtro grigio, i marchi con poco contrasto spariscono. Poi rallenta la rete e guarda se la fascia salta mentre carica. Infine riduci il movimento nelle preferenze di sistema: un marquee che continua a scorrere è un difetto di accessibilità, non una scelta di stile.

• Loghi in SVG con currentColor, così seguono il tema senza duplicati.
• width e height dichiarati, oppure aspect-ratio sul contenitore.
• Sei o otto loghi leggibili meglio di venti illeggibili.
• Alt con il nome dell’azienda, non la parola logo ripetuta.

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

Il limite: sono logo cloud, non loghi

La categoria si chiama logo ma contiene sezioni che mostrano loghi altrui: non troverai qui un file di marchio, una guida al ridisegno o un componente per il logo del sito. Quarantanove righe su 74 arrivano da un solo publisher, quindi la varietà è molto inferiore al numero, e il raggruppamento nasce dal titolo “logo cloud”, non da un campo del manifest.

Regola di decisione

Fino a otto loghi prendi una griglia statica: costa meno, non richiede JavaScript e non nasconde nomi. Oltre i dodici, un marquee ha senso, ma solo con pausa al passaggio del mouse, stop da tastiera e rispetto di prefers-reduced-motion. L’alternativa è costruirla con una griglia e SVG inline: sei immagini, un flex-wrap e un gap, e ottieni lo stesso effetto senza le registry dependency. Il blocco conviene quando porta varianti di ritaglio su mobile che non vuoi riscrivere.

Le sezioni stanno su /blocks/category/logo, l’inventario su /blocks, e Logo Cloud 15 ha la scheda qui. Per le immagini leggi immagini responsive con srcset, per evitare i salti aspect-ratio sulle immagini, e per il confronto tra cataloghi a copia-incolla i migliori siti di componenti da copiare.