ફોન્ટલેન્સ

Chrome માટે મફત એક્સ્ટેંશન

આ કયો ફોન્ટ છે? રાઇટ-ક્લિક કરો અને CSS જુઓ

કોઈપણ વેબસાઇટ પર ટેક્સ્ટ પસંદ કરો, રાઇટ-ક્લિક કરો અને “Inspect font with FontLens” પસંદ કરો. પેજ પર ફોન્ટ ઇન્સ્પેક્ટર ખુલશે: font-family, સાઇઝ, વેઇટ, line-height, રંગ, કૉપિ કરવા તૈયાર CSS અને ફોન્ટ ડાઉનલોડ બટન.

Chrome માં ઉમેરો — મફત

Edge, Brave, Opera અને અન્ય Chromium બ્રાઉઝરમાં પણ કામ કરે છે.

FontLens ઇન્સ્પેક્ટર: cap-height, x-height અને baseline માપદર્શકો વચ્ચે Ag નમૂનો, ફોન્ટ ગુણધર્મો અને Tailwind કોડ

એક નજરમાં

શું કરે છે
તમે પસંદ કરેલા ટેક્સ્ટનો ફોન્ટ બતાવે છે: family, સાઇઝ, વેઇટ, line-height, રંગ અને ડિફૉલ્ટથી અલગ અન્ય શૈલીઓ, સાથે કૉપિ કરવા તૈયાર CSS.
શરૂ કેવી રીતે કરવું
ટેક્સ્ટ પસંદ કરો, રાઇટ-ક્લિક કરો અને “Inspect font with FontLens” પસંદ કરો. આ મેનૂ વિકલ્પ ફક્ત ટેક્સ્ટ પસંદ હોય ત્યારે દેખાય છે.
કૉપિ ફોર્મેટ
CSS, SCSS, SASS અથવા Tailwind, px, rem, pt અથવા em માં સાઇઝ સાથે.
ફોન્ટ ફાઇલ
“Download font”, @font-face સ્રોતમાંથી વેબ ફોન્ટ મેળવે છે. ઉપયોગ કરતા પહેલાં ફોન્ટનું લાઇસન્સ તપાસો.
કોના માટે
વેબ ડિઝાઇનર્સ, front-end ડેવલપર્સ, ઍક્સેસિબિલિટી ઑડિટર્સ અને CSS શીખતા વિદ્યાર્થીઓ.
કિંમત
મફત. એકાઉન્ટ નથી, પેઇડ સંસ્કરણ નથી.
ડેટા
તમારા બ્રાઉઝરમાં ચાલે છે. સર્વર કે એનાલિટિક્સ નથી. તમે શરૂ કરો તે ફોન્ટ ડાઉનલોડ જ એકમાત્ર વિનંતી છે.
ક્યાં કામ કરે છે
Chrome Web Store પરથી ઇન્સ્ટોલ થતા Chrome અને અન્ય Chromium બ્રાઉઝરમાં. Firefox કે Safariમાં નહીં.
મર્યાદાઓ
વેબ પેજ પરના વાસ્તવિક ટેક્સ્ટનું CSS વાંચે છે. છબી, canvas કે PDFનું લખાણ અથવા Chromeનાં પોતાના પેજ વાંચતું નથી.
સંસ્કરણ
2.2.0, 23 ઑક્ટોબર, 2026ના રોજ અપડેટ થયું

ફોન્ટ સુધી બે ક્લિક

  1. 1

    ટેક્સ્ટ પસંદ કરો

    કોઈપણ વેબ પેજ પરનું મથાળું, ફકરો અથવા બટનનું લખાણ.

  2. 2

    રાઇટ-ક્લિક કરો

    “Inspect font with FontLens” પસંદ કરો. પેજ પર ઇન્સ્પેક્ટર ખુલશે અને family, સાઇઝ, વેઇટ, line-height તથા રંગ બતાવશે.

  3. 3

    કૉપિ કરો અથવા બદલો

    CSS અથવા Tailwind કૉપિ કરો, લાઇવ પ્રિવ્યૂમાં સાઇઝ કે રંગ અજમાવો અથવા ફોન્ટ ફાઇલ ડાઉનલોડ કરો.

લોકો તેનો ઉપયોગ શા માટે કરે છે

Aa

ટાઇપફેસનું નામ જાણો

ગમતું મથાળું જોયું? તેને પસંદ કરીને family, વેઇટ અને ફોન્ટ ક્યાંથી આવે છે તે જુઓ: Google Fonts, Adobe Fonts કે સાઇટમાંથી.

{ }

મૉકઅપ સાથે મેળવો

લાઇવ પેજના આંકડા ડિઝાઇન ફાઇલ સાથે સરખાવો, પછી નિયમો CSS, SCSS, SASS અથવા Tailwind તરીકે કૉપિ કરો.

4.5:1

કોન્ટ્રાસ્ટ તપાસો

AA અને AAA નિશાન સાથે કોન્ટ્રાસ્ટ રેશિયો જુઓ. ડિઝાઇન પ્રકાશિત કરતાં પહેલાં ઘાટો ટેક્સ્ટ અથવા હળવું બૅકગ્રાઉન્ડ અજમાવો.

આ શું કરે છે

  • માપદર્શક સાથે નમૂનો

    સ્ટૅકનો પહેલો family, ફોન્ટમાંથી માપેલા cap-height, x-height અને baseline માપદર્શકો વચ્ચે દર્શાવાય છે.

  • કોડના ફોર્મેટ

    CSS, SCSS, SASS અને Tailwind. આખો કોડ કે એક લીટી કૉપિ કરો; છેલ્લે વાપરેલું ફોર્મેટ યાદ રહે છે.

  • તમારા એકમો

    ફીલ્ડ અને કોડમાં px, rem, pt અથવા em માં સાઇઝ જુઓ. rem પેજના root સાઇઝ પ્રમાણે ગણાય છે.

  • ફોન્ટ સ્રોત

    બૅજ બતાવે છે ફોન્ટ Google Fonts, Adobe Fonts, self-hosted કે તમારા કમ્પ્યુટરના system font માંથી છે.

  • કોન્ટ્રાસ્ટ તપાસ

    ટેક્સ્ટ અને બૅકગ્રાઉન્ડ વચ્ચેનો રેશિયો, સામાન્ય અને મોટા ટેક્સ્ટ માટે AA અને AAA નિશાન સાથે. રંગ બદલતાં તે અપડેટ થાય છે.

  • ફોન્ટ ડાઉનલોડ

    @font-face સ્રોતમાંથી familyના નામે ફાઇલ મેળવો. સર્વર અટકાવે તો સ્રોત નવા ટૅબમાં ખૂલે છે.

DevToolsમાં “આ કયો ફોન્ટ છે?” શોધવામાં આટલો સમય કેમ લાગે છે

પેજ ફોન્ટની યાદી આપે છે અને બ્રાઉઝર ઉપલબ્ધ પહેલો ફોન્ટ વાપરે છે. કયો છે તે જાણવા DevTools ખોલો, element શોધો, Computed પેનલ જુઓ અને Network પેનલમાં ફોન્ટ ફાઇલ શોધો. સાઇઝ, વેઇટ, line-height અને રંગ અલગ અલગ જગ્યાએ હોય છે.

FontLens તમે પસંદ કરેલા ટેક્સ્ટની computed style વાંચીને એક પેનલમાં મૂકે છે: family stack, પહેલા familyનો નમૂનો, માપ, ફોન્ટનો સ્રોત અને CSS. તે પેજનું CSS વાંચે છે, તેથી છબીમાંના ફોન્ટનું નામ જણાવી શકતું નથી.

તમારા બ્રાઉઝરની બહાર કશું જતું નથી

  • એકાઉન્ટ નહીં, સર્વર નહીં

    FontLens તમારા બ્રાઉઝરમાં ચાલે છે. એનાલિટિક્સ કે ટ્રૅકિંગ નથી.

  • તમે પસંદ કરો તે જ વાંચે છે

    ઇન્સ્પેક્ટર તમે રાઇટ-ક્લિક કરેલા ટેક્સ્ટની શૈલીઓ વાંચે છે. પેજ વિશેની કોઈ માહિતી બહાર મોકલાતી નથી.

  • ચાર પરવાનગીઓ

    રાઇટ-ક્લિક મેનૂ માટે context menu, ઇન્સ્પેક્ટર ખોલવા active tab અને પેજ ઍક્સેસ, તથા નમૂના ટેક્સ્ટ, એકમ અને કોડ ફોર્મેટ માટે storage.

Chrome DevTools અને FontLens

Chrome DevTools અને FontLensChrome DevToolsFontLens
ટેક્સ્ટનો ફોન્ટ શોધોInspect કરો, element શોધો, Computed પેનલ ખોલોટેક્સ્ટ પસંદ કરો, રાઇટ-ક્લિક, એક મેનૂ વિકલ્પ
Tailwind અથવા SCSS તરીકે કૉપિના, મૂલ્યો એક પછી એક કૉપિ કરોCSS, SCSS, SASS અથવા Tailwind ટૅબ
ફોન્ટ ક્યાંથી આવે છેNetwork પેનલમાં ફોન્ટ ફાઇલ શોધોબૅજ: Google Fonts, Adobe Fonts, self-hosted અથવા system
ફોન્ટ ફાઇલ ડાઉનલોડNetwork અથવા Sourcesમાં શોધીને સેવ કરોએક બટન
કોન્ટ્રાસ્ટ તપાસStyles પેનલના રંગ પિકરમાંલાઇવ પ્રિવ્યૂ પાસે AA અને AAA નિશાન
કિંમતઅંદરથી ઉપલબ્ધમફત

પ્રશ્નો

વેબસાઇટ કયો ફોન્ટ વાપરે છે તે કેવી રીતે શોધું?

Chromeમાં FontLens ઉમેરો, સાઇટ પર ટેક્સ્ટ પસંદ કરો, રાઇટ-ક્લિક કરીને “Inspect font with FontLens” પસંદ કરો. ફોન્ટ family, સાઇઝ, વેઇટ, line-height, રંગ અને તેનો સ્રોત દેખાશે.

વેબસાઇટના ફોન્ટનું CSS કેવી રીતે કૉપિ કરું?

ઇન્સ્પેક્ટરમાં CSS, SCSS, SASS અથવા Tailwind ટૅબ પસંદ કરીને “Copy all” દબાવો, અથવા એક લીટી કૉપિ કરો. જરૂર હોય તો પહેલાં એકમ px, rem, pt અથવા em કરો.

વેબસાઇટ પરથી ફોન્ટ ડાઉનલોડ કરી શકું?

ટેક્સ્ટ વેબ ફોન્ટ વાપરે ત્યારે “Download font” @font-face સ્રોતમાંથી ફાઇલ મેળવે છે. system font ડાઉનલોડ કરી શકાતો નથી. તમારા પ્રોજેક્ટમાં વાપરતા પહેલાં લાઇસન્સ તપાસો.

FontLens છબી કે PDFમાંનો ફોન્ટ ઓળખી શકે?

ના. તે વેબ પેજ પરના વાસ્તવિક ટેક્સ્ટનું CSS વાંચે છે, તેથી છબી, canvas કે PDFમાંના ફોન્ટનું નામ જણાવી શકતું નથી.

WCAG માટે ટેક્સ્ટનો કોન્ટ્રાસ્ટ કેવી રીતે તપાસું?

પ્રિવ્યૂ ટેક્સ્ટ અને બૅકગ્રાઉન્ડના રંગ વચ્ચેનો કોન્ટ્રાસ્ટ રેશિયો તથા સામાન્ય અને મોટા ટેક્સ્ટ માટે AA અને AAA નિશાન બતાવે છે. કોઈપણ રંગ બદલો, નિશાન અપડેટ થશે.

pxની બદલે remમાં સાઇઝ બતાવી શકાય?

હા. px, rem, pt અથવા em પસંદ કરો; ફીલ્ડ અને કોડ તે પ્રમાણે બદલાશે. rem પેજના root font સાઇઝ પરથી ગણાય છે અને તમારી પસંદ યાદ રહે છે.

આ મફત છે? શું ડેટા એકત્ર કરે છે?

આ મફત છે અને એકાઉન્ટની જરૂર નથી. સર્વર કે એનાલિટિક્સ નથી; તમે શરૂ કરો તે ફોન્ટ ડાઉનલોડ જ એકમાત્ર વિનંતી છે.

શું તે Edge, Brave કે Opera માં કામ કરે છે?

મોટાભાગના Chromium બ્રાઉઝર્સ Chrome Web Store પરથી એક્સ્ટેંશન ઇન્સ્ટોલ કરે છે, જેમાં Edge, Brave, Opera અને Vivaldi નો સમાવેશ થાય છે. Firefox અને Safari સપોર્ટેડ નથી.

PYROCTAL માંથી વધુ મફત એક્સ્ટેન્શન્સ

આ કયો ફોન્ટ છે? ફક્ત બે ક્લિક.

Add to Chrome — free