FontLens

Brezplačna razširitev za Chrome

Katera pisava je to? Klikni z desno in preveri CSS

Izberi besedilo na kateri koli spletni strani, klikni z desno tipko in izberi »Inspect font with FontLens«. Nad stranjo se odpre pregledovalnik z družino, velikostjo, debelino, višino vrstice in barvo, CSS za kopiranje ter gumbom za prenos pisave.

Dodaj v Chrome — brezplačno

Deluje tudi v brskalnikih Edge, Brave, Opera in drugih na osnovi Chromiuma.

Pregledovalnik FontLens: vzorec Ag med vodili za višino velikih črk, višino x in osnovnico, lastnosti pisave ter izsek Tailwind

Na kratko

What it does
Prikaže pisavo izbranega besedila: družino, velikost, debelino, višino vrstice, barvo in druge sloge, ki se razlikujejo od privzetih, s CSS za kopiranje.
How to start
Izberi besedilo, klikni z desno tipko in izberi »Inspect font with FontLens«. Menijski element se prikaže samo, ko je besedilo izbrano.
Copy as
CSS, SCSS, SASS ali Tailwind, z velikostjo v px, rem, pt ali em.
Font file
»Download font« prenese spletno pisavo iz njenega vira @font-face. Pred uporabo preveri licenco.
Who it is for
Spletni oblikovalci, front-end razvijalci, presojevalci dostopnosti in študenti CSS.
Price
Brezplačno. Brez računa in plačljive različice.
Data
Deluje v brskalniku. Brez strežnikov in analitike. Edina zahteva je prenos pisave, ki ga začneš.
Works in
Chrome in drugi brskalniki Chromium, ki nameščajo iz Chrome Web Store. Firefox in Safari nista podprta.
Limits
Bere CSS pravega besedila na spletnih straneh. Ne prepozna besedila na slikah, v canvasih ali PDF-jih ter na straneh brskalnika Chrome.
Različica
2.2.0, posodobljeno 23. oktober 2026

Do pisave v dveh klikih

  1. 1

    Select text

    Naslov, odstavek ali oznaka gumba na kateri koli spletni strani.

  2. 2

    Right-click

    Izberi »Inspect font with FontLens«. Nad stranjo se odpre pregledovalnik z družino, velikostjo, debelino, višino vrstice in barvo.

  3. 3

    Copy or tweak

    Kopiraj CSS ali Tailwind, v predogledu v živo preizkusi drugo velikost ali barvo ali prenesi datoteko pisave.

Zakaj ga odprejo

Aa

Ugotovi ime pisave

Ti je všeč naslov? Izberi ga in preveri družino, debelino ter vir pisave: Google Fonts, Adobe Fonts ali samo spletno mesto.

{ }

Uskladi z maketo

Primerjaj vrednosti na spletni strani z datoteko zasnove in nato kopiraj pravila kot CSS, SCSS, SASS ali Tailwind.

4.5:1

Preveri kontrast

Preveri razmerje kontrasta z oznakami AA in AAA. Pred objavo preizkusi temnejše besedilo ali svetlejše ozadje.

Kaj zmore

  • Vzorec z vodili

    Prva družina iz seznama, prikazana med vodili za višino velikih črk, višino x in osnovnico, izmerjenimi iz same pisave.

  • oblike izsekov

    CSS, SCSS, SASS in Tailwind. Kopiraj celoten izsek ali eno vrstico; zadnja oblika se shrani.

  • Tvoje enote

    Velikost prikaži v px, rem, pt ali em v poljih in izseku. rem sledi osnovni velikosti strani.

  • Vir pisave

    Značka pokaže vir pisave: Google Fonts, Adobe Fonts, lastno gostovanje ali sistemsko pisavo v računalniku.

  • Preverjanje kontrasta

    Razmerje med besedilom in ozadjem z oznakami AA in AAA za običajno in veliko besedilo; posodobi se ob vsaki spremembi barv.

  • Prenesi pisavo

    Prenese datoteko iz vira @font-face in jo poimenuje po družini. Če strežnik prenos blokira, se vir odpre v novem zavihku.

Zakaj iskanje pisave v DevTools traja tako dolgo

Stran navede seznam pisav, brskalnik pa uporabi prvo, ki jo ima. Če želiš izvedeti katero, odpri DevTools, poišči element, preberi podokno Computed, nato pa poišči datoteko pisave v podoknu Network. Velikost, debelina, višina vrstice in barva so na različnih mestih.

FontLens prebere izračunani slog izbranega besedila in ga prikaže v enem podoknu: seznam družin, vzorec prve družine, vrednosti, vir pisave in CSS. Bere CSS strani, zato ne more poimenovati pisave na sliki.

Nič ne zapusti tvojega brskalnika

  • Brez računa in strežnikov

    FontLens deluje v brskalniku. Brez analitike in sledenja.

  • Bere izbrano besedilo

    Pregledovalnik prebere sloge besedila, ki si ga kliknil z desno tipko. Podatki o strani se nikamor ne pošiljajo.

  • Štiri dovoljenja

    Kontekstni meni za klik z desno tipko, dostop do aktivnega zavihka in strani za odprtje pregledovalnika ter shramba za vzorčno besedilo, enoto in obliko izseka.

Chrome DevTools in FontLens

Chrome DevTools in FontLensChrome DevToolsFontLens
Poišči pisavo besedilaPreglej stran, poišči element in odpri podokno ComputedIzberi besedilo, klikni z desno tipko, izberi menijski element
Kopiranje kot Tailwind ali SCSSNe, vrednosti kopiraš posamičnoZavihek CSS, SCSS, SASS ali Tailwind
Vir pisaveDatoteko pisave poišči v podoknu NetworkZnačka: Google Fonts, Adobe Fonts, lastno gostovanje ali sistem
Prenos datoteke pisavePoišči jo v Network ali Sources in shraniEn gumb
Preverjanje kontrastaV izbirniku barv podokna StylesOznaki AA in AAA ob predogledu v živo
CenaVgrajenoBrezplačno

Vprašanja

Kako ugotovim, katero pisavo uporablja spletno mesto?

Dodaj FontLens v Chrome, izberi besedilo na strani, klikni z desno tipko in izberi »Inspect font with FontLens«. Prikazani bodo družina, velikost, debelina, višina vrstice, barva in vir pisave.

Kako kopiram CSS pisave s spletnega mesta?

V pregledovalniku izberi zavihek CSS, SCSS, SASS ali Tailwind in pritisni »Copy all« ali kopiraj posamezno vrstico. Po potrebi najprej preklopi enoto na px, rem, pt ali em.

Ali lahko prenesem pisavo s spletnega mesta?

Če besedilo uporablja spletno pisavo, »Download font« prenese datoteko iz njenega vira @font-face. Sistemske pisave ni mogoče prenesti. Pred uporabo v svojem projektu preveri licenco.

Ali FontLens prepozna pisavo na sliki ali v PDF-ju?

Ne. Bere CSS pravega besedila na spletnih straneh, zato ne prepozna pisav na slikah, v canvasih ali PDF-jih.

Kako preverim kontrast besedila po WCAG?

Predogled prikazuje razmerje med barvo besedila in ozadjem z oznakama AA in AAA za običajno in veliko besedilo. Spremeni katero koli barvo in oznaki se posodobita.

Ali lahko prikaže velikosti v rem namesto v px?

Da. Preklopi enoto na px, rem, pt ali em, polja in izsek pa se prilagodijo. rem se izračuna iz osnovne velikosti pisave strani, tvoja izbira pa se shrani.

Je brezplačen? Ali zbira podatke?

Brezplačen je in ne potrebuje računa. Nima strežnikov ali analitike; edina zahteva je prenos pisave, ki ga začneš.

Ali deluje v Edge, Brave ali Opera?

Večina brskalnikov Chromium namešča razširitve iz Chrome Web Store, tudi Edge, Brave, Opera in Vivaldi. Firefox in Safari nista podprta.

Druge brezplačne razširitve PYROCTAL

Katera pisava je to? Dva klika.

Add to Chrome — free