Cum să găsiți fontul unei pagini Web utilizând instrumentul Inspect Element și extensiile browserului

succesul site-ului dvs. depinde foarte mult de aspectul său. Având combinația potrivită de culori și tema va păstra vizitatorii pe site-ul dvs. pentru un pic mai mult. Pe lângă paleta de culori și structura site-ului dvs., fontul pe care îl alegeți joacă, de asemenea, un rol esențial în menținerea implicării publicului.

poate că întâlniți un site atrăgător în timp ce navigați pe web și doriți să știți ce fonturi utilizează. Cu extensiile online și instrumentul încorporat Inspect Element al browserului dvs., identificarea unui font este rapidă și ușoară.

cum să găsiți fonturi folosind instrumentul Inspect Element

în cazul în care nu știați, instrumentul Inspect Element încorporat al browserului vă permite să examinați codul sursă al unui site web. Puteți înțelege elementele de design ale unui site uitându-vă la CSS, HTML și alte informații. Este o modalitate excelentă de a vă inspira atunci când vă proiectați propriul site.

procesul de identificare a unui font folosind instrumentul Inspect Element este destul de simplu și nu veți avea nevoie de abilități de codificare. Acest instrument este disponibil în toate browserele de pe piață și fiecare are un aspect similar.

Iată cum puteți identifica un font folosind instrumentul de inspecție al browserului.

1. Deschideți site-ul web pe care doriți să îl utilizați.
2. evidențiați textul care are fontul pe care doriți să îl identificați și faceți clic dreapta pe el.
3. Faceți clic pe inspectați din meniul contextual.
   

   

4. când se deschide meniul Inspect, faceți clic pe calculat.
5. Derulați în jos pentru a găsi secțiunea Font-Family. Aici puteți găsi numele și stilul fontului, precum și dimensiunile acestuia.
   

   

alte modalități de utilizare a instrumentului Inspect

dacă doriți o modalitate mai rapidă de a găsi fontul unui site folosind instrumentul Inspect, încercați acest lucru:

1. Deschideți site-ul web pe care doriți să îl utilizați.
2. apăsați Ctrl + Shift + C (Cmd + Shift + C pe Mac).
3. plasați cursorul peste text pentru a afișa stilul fontului, dimensiunea, codul de culoare și marja.
   

   

de asemenea, puteți verifica lista fonturilor utilizate pe o pagină web utilizând instrumentul Inspect. Iată cum se face acest lucru:

1. accesați pagina web.
2. deschideți codul sursă apăsând Ctrl + Shift + I (Cmd + Shift + I pe Mac).
3. Faceți clic pe fila Rețea, apoi selectați fila Font.
4. aici veți vedea o listă cu toate fonturile utilizate pe pagina web.
   

   

pentru a obține lista tuturor fonturilor în timp real, poate fi necesar să reîmprospătați pagina web.

cum să identificați fonturile folosind extensiile de Browser

dacă doriți o modalitate mai convenabilă de a identifica un font, este posibil să doriți să instalați o extensie de browser pentru găsirea fontului. Deși există mai multe extensii de browser care pot ajuta la detectarea fonturilor pe web, cele mai populare două sunt WhatFont și Font Finder.

să aruncăm o privire la procesul de identificare a fonturilor folosind ambele extensii.

WhatFont

WhatFont este foarte popular pentru detectarea rapidă a mai multor fonturi simultan. Iată cum să utilizați acest instrument.

1. când WhatFont este activat în browserul dvs., treceți cu mouse-ul peste text pentru a afișa fontul acestuia.
   

   

2. după ce faceți clic pe text, va apărea o fereastră pop-up cu restul detaliilor fontului, cum ar fi dimensiunea fontului, culoarea și stilul.
   

   

3. în plus, puteți selecta mai multe secțiuni de text simultan pentru a compara diferite fonturi pe aceeași pagină.
   

   

Descărcare: WhatFont pentru Chrome / Firefox / Safari (gratuit)

Font Finder

Font Finder afișează, de asemenea, detaliile fontului atunci când treceți cu mouse-ul peste orice text de pe un site web. Cu toate acestea, oferă o mulțime de detalii tehnice, astfel încât poate deveni puțin confuz dacă nu sunteți familiarizați cu designul web.

acestea fiind spuse, Font Finder este mai potrivit pentru dezvoltatorii web care doresc să înlocuiască fonturile existente cu altele noi în timp real. Acest lucru facilitează testarea fonturilor înainte de a face modificări permanente.

Iată cum să testați un font folosind Font Finder:

1. evidențiați o porțiune de text din pagina web.
2. faceți clic dreapta pe el și selectați Font Finder din meniul contextual.
   

   

3. selectați înlocuiți fontul cu și introduceți numele fontului. Să adăugăm Calibri și să vedem cum schimbă fontul în previzualizare.
   

   

4. dacă doriți să resetați fontul, reîmprospătați pagina.
   

   

descărcați: FontFinder pentru Chrome / Edge / Firefox (gratuit)

Ce zici de verificarea fontului dintr-o imagine?

dacă doriți să identificați fonturile dintr-o imagine, este posibil ca extensiile browserului și instrumentul de inspecție al browserului dvs. să nu vă ajute. Cu toate acestea, puteți încerca instrumente de inspector de imagini online precum WhatFontIs, FontSquirrel, Fontspring, WhatTheFont și multe altele.

procesul de identificare a unui font dintr-o imagine este în mare parte același în toate instrumentele. Să încercăm să identificăm fontul dintr-o imagine folosind Whathefont.

1. dacă nu ați făcut-o deja, descărcați imaginea pe care doriți să o utilizați.
2. Importați imaginea în WhatTheFont.
   

   

3. WhatTheFont va detecta automat textul din imagine. Micșorați sau măriți caseta de decupare astfel încât să înconjoare fontul pe care doriți să îl identificați. Apăsați butonul săgeată când ați terminat.
   

   

4. WhatTheFont va potrivi apoi fontul din imagine cu fonturile din galeria sa și vă va arăta fonturi strâns legate.
   

   

5. dacă nu găsiți imediat o potrivire bună, puteți continua să faceți clic pe Afișați mai multe rezultate pentru a vedea mai multe fonturi conexe.
   

   

detectați fonturile de pe Web și utilizați-le în desenele dvs.

fonturile joacă un rol semnificativ în succesul unui site web sau al unui design grafic. Dacă vă împiedicați de un font atrăgător în timp ce navigați pe web, îl puteți detecta cu ușurință folosind metodele de mai sus.