@font-face Generatore Webfont
Font variabili, WOFF2 e CSS in un clic
Inserisci i tuoi file TTF, OTF, WOFF o WOFF2 — inclusi i font variabili — scegli le tue impostazioni e scarica un pacchetto pronto per l'hosting con WOFF2, WOFF, un foglio di stile.css completo e una pagina demo dal vivo.
Trascina i font qui o clicca per sfogliare
TTF, OTF, WOFF, WOFF2 e font variabili — file multipli consentiti
Font selezionati
Impostazioni di conversione
Questo è il nome che utilizzerai nel tuo CSS, come font-family: 'MyName';. Lascia vuoto per mantenere il nome della famiglia originale di ciascun font dal file.
Controlla come viene mostrato il testo mentre il webfont si sta caricando.
Percorso utilizzato all'interno di url(...) nel foglio di stile generato.
Suggerimento: premi Ctrl+Invio per generare.
Il tuo pacchetto webfont è pronto
ZIP contiene: font convertiti, stylesheet.css e una demo.html dal vivo.
100% lato client
La conversione avviene interamente nel tuo browser utilizzando WebAssembly. I tuoi font non vengono mai caricati.
Font variabili & tutti i formati
TTF, OTF, WOFF e WOFF2 in — WOFF2 ottimizzato fuori, con pieno supporto per gli assi dei font variabili (wght, wdth, slnt, ital).
Output pronto per la produzione
Spedisce un foglio di stile.css con il giusto font-display, opzionale local() e una demo.html in modo da poter inserire direttamente il pacchetto nel tuo progetto.
Cos'è un generatore di webfont?
Un generatore di webfont trasforma i file di font desktop o scaricati (TTF, OTF, WOFF, WOFF2 — inclusi i moderni font variabili) nei formati che i browser possono caricare tramite il web — principalmente WOFF2 oggi, con WOFF come fallback legacy — e produce dichiarazioni CSS @font-face corrispondenti in modo da poter ospitare autonomamente la tipografia del tuo sito web.
Perché auto-ospitare i font?
L'auto-ospitazione ti dà il pieno controllo su prestazioni, privacy e affidabilità. Non ci sono richieste di terze parti a Google Fonts (utile per il GDPR), nessuna ricerca DNS extra, puoi pre-caricare il file e decidi esattamente quali pesi, stili e assi vengono spediti con il tuo sito.
Come funziona la conversione
WOFF2 avvolge i tuoi contorni TTF/OTF in un contenitore compresso Brotli progettato specificamente per il web — tipicamente il 30 % più piccolo di WOFF e oltre il 50 % più piccolo del TTF grezzo. WOFF è un wrapper più vecchio compresso con zlib, mantenuto come fallback per browser molto vecchi. Il nostro generatore esegue l'encoder e decoder ufficiale WOFF2 di Google compilato in WebAssembly, quindi la conversione avviene localmente all'interno del tuo browser. Inserisci un WOFF2 scaricato da Google Fonts e lo decodifichiamo trasparentemente di nuovo in un contenitore sfnt prima di ri-codificarlo — non dovrai mai cercare il TTF originale.
Cosa ottieni nel pacchetto
- Font in WOFF2 (e opzionalmente WOFF/TTF) per ogni faccia caricata — inclusi i font variabili mantenuti come un singolo file piccolo.
- Un foglio di stile.css completo con una regola @font-face per file, gli indizi format() corretti, intervalli di font-weight, font-style, font-stretch, font-display e opzionale local().
- Una pagina demo.html in modo da poter visualizzare ogni peso, stile e asse in diverse dimensioni prima di andare in diretta.
- Incorporamento Base64 opzionale per spedire il font inline nel tuo CSS per scenari offline-first o a file singolo.
Privacy e licenze
I file non lasciano mai il tuo dispositivo — tutto viene elaborato nel tuo browser. Assicurati sempre che la licenza del tuo font consenta l'incorporamento del webfont prima di pubblicarlo sul tuo sito web.