Identifica il carattere tipografico e la tipografia CSS su qualsiasi elemento della pagina web (famiglia, dimensione, spessore, altezza della linea, spaziatura delle lettere, colore e contrasto), quindi copia o esporta ciò che ti serve senza uscire dalla scheda.
Costruito per la tipografia dal vivo
Passa il mouse e fai clic sul testo per visualizzare il carattere tipografico, le dimensioni, lo spessore, lo stile e il colore in tempo reale, vicino all'elemento o in una barra laterale, senza aprire DevTools.
Leggi l'altezza della riga, la spaziatura delle lettere, la trasformazione, la decorazione e il contrasto (inclusi i segnali AAA/AA) in un unico pannello.
Copia la famiglia di caratteri, il colore o uno snippet CSS pronto per l'elemento che hai ispezionato.
Modifica peso, dimensione, spaziatura, colore e altro sull'elemento live, quindi reimpostalo una volta terminata l'esplorazione.
Scansiona stili di testo univoci sulla pagina e passa da uno all'altro durante il controllo di un sistema di progettazione.
Esporta la tipografia come __SCSSLIT__ o JSON oppure apri una ricerca Google Fonts per la famiglia che hai trovato.
Semplice nel design
Un'estensione Chrome che rivela la tipografia live—tipo, dimensione, peso, colore e contrasto—così puoi ispezionare, copiare ed esportare i font da qualsiasi pagina web.
Chrome Web Store
Feedback di esempio a scopo illustrativo — le recensioni del Chrome Web Store li sostituiranno quando saranno collegate.
“Posso recuperare famiglia, peso e colore hex da un sito live senza aprire DevTools.”
“Copiare CSS e contrasto in un unico pannello è esattamente ciò che mi serve durante gli audit.”
“Tutti i font della pagina mi aiuta a individuare rapidamente tipografia incoerente su una landing page.”
Tre rapidi passaggi
Aggiungi what the font - font finder dal Chrome Web Store e fissalo alla barra degli strumenti.
Apri il popup, avvia l'ispezione, poi passa il cursore e fai clic su qualsiasi testo della pagina.
Copia CSS, esporta gli stili, apri Google Fonts o sfoglia tutti i font della pagina.
Risposte prima dell'installazione
Installa what the font - font finder, inizia a ispezionare, posiziona il mouse sul testo e fai clic per aprire il pannello con famiglia, dimensione, peso e colore.
SÌ. Dal pannello puoi copiare la famiglia di caratteri, il colore o uno snippet CSS per l'elemento ispezionato.
Funziona su normali schede del sito Web. Le pagine di sistema Chrome e alcuni URL con restrizioni non possono essere controllati.
Utilizza Tutti i caratteri nella pagina per elencare stili di testo visibili univoci e aprirne uno qualsiasi nel pannello dei dettagli.
SÌ. Modifica peso, dimensione, spaziatura, colore e stili correlati sull'elemento, quindi reimposta per ripristinare l'originale.
Quando la famiglia risulta ricercabile, utilizza l'azione Google Fonts nel pannello per aprire una query per quel nome.
Continua a esplorare
