Så här hittar du en webbsidas teckensnitt med hjälp av verktyget Inspektera Element och webbläsartillägg

framgången för din webbplats beror mycket på dess utseende. Att ha rätt färgkombination och tema kommer att hålla dina besökare på din webbplats lite längre. Förutom webbplatsens färgpalett och struktur spelar teckensnittet du väljer också en viktig roll för att hålla din publik engagerad.

kanske stöter du på en tilltalande webbplats när du surfar på webben, och du vill veta vilka teckensnitt den använder. Med online-tillägg och din webbläsares inbyggda Inspect Element-verktyg är det snabbt och enkelt att identifiera ett teckensnitt.

så här hittar du teckensnitt med hjälp av verktyget Inspektera Element

om du inte visste det kan din webbläsares inbyggda verktyg Inspektera Element undersöka en webbplats källkod. Du kan förstå designelementen på en webbplats genom att titta på dess CSS, HTML och annan information. Det är ett bra sätt att få inspiration när du utformar din egen webbplats.

processen att identifiera ett teckensnitt med verktyget Inspektera Element är ganska enkelt, och du behöver inga kodningsförmåga. Detta verktyg är tillgängligt i alla webbläsare på marknaden, och alla har en liknande layout.

så här identifierar du ett teckensnitt med hjälp av webbläsarens Inspektionsverktyg.

1. öppna webbplatsen du vill använda.
2. markera texten som har teckensnittet du vill identifiera och högerklicka på det.
3. klicka på inspektera från snabbmenyn.
   

   

4. när Inspect-menyn öppnas klickar du på den beräknade.
5. bläddra ner för att hitta avsnittet Font-Family. Här kan du hitta teckensnittsnamn och stil samt dess dimensioner.
   

   

andra sätt att använda verktyget inspektera

om du vill ha ett snabbare sätt att hitta en webbplats teckensnitt med verktyget inspektera, prova detta istället:

1. öppna webbplatsen du vill använda.
2. tryck på Ctrl + Skift + C (cmd + Skift + C på Mac).
3. håll muspekaren över texten för att visa teckensnitt, storlek, färgkod och marginal.
   

   

du kan också kontrollera listan över teckensnitt som används på en webbsida med hjälp av verktyget inspektera. Så här gör du det här:

1. gå till webbsidan.
2. öppna källkoden genom att trycka på Ctrl + Skift + i (Cmd + skift + i på Mac).
3. klicka på fliken Nätverk och välj sedan fliken Teckensnitt.
4. här ser du en lista över alla teckensnitt som används på webbsidan.
   

   

för att få listan över alla teckensnitt i realtid kan du behöva uppdatera webbsidan.

så här identifierar du teckensnitt med webbläsartillägg

om du vill ha ett bekvämare sätt att identifiera ett teckensnitt kanske du vill installera ett webbläsartillägg för att hitta teckensnitt. Även om det finns flera webbläsartillägg som kan hjälpa till att upptäcka teckensnitt på webben, är de två mest populära WhatFont och Font Finder.

Låt oss ta en titt på processen att identifiera teckensnitt med båda tilläggen.

WhatFont

WhatFont är mycket populärt för att snabbt upptäcka flera teckensnitt samtidigt. Så här använder du det här verktyget.

1. när WhatFont är aktiverat i din webbläsare, håll muspekaren över texten för att visa teckensnittet.
   

   

2. när du klickar på texten visas ett popup-fönster med resten av teckensnittsdetaljerna, till exempel teckenstorlek, färg och stil.
   

   

3. Dessutom kan du välja flera textavsnitt samtidigt för att jämföra olika teckensnitt på samma sida.
   

   

Ladda Ner: WhatFont för Chrome / Firefox / Safari (gratis)

Font Finder

Font Finder visar också teckensnittsdetaljer när du håller muspekaren över någon text på en webbplats. Det ger dock många tekniska detaljer, så det kan bli lite förvirrande om du inte är bekant med webbdesign.

som sagt är Font Finder mer lämplig för webbutvecklare som vill ersätta befintliga teckensnitt med nya i realtid. Detta gör det enkelt att testa teckensnitt innan du gör några permanenta ändringar.

så här testar du ett teckensnitt med Font Finder:

1. markera en del text från webbsidan.
2. högerklicka på den och välj Font Finder från snabbmenyn.
   

   

3. Välj ersätt teckensnitt med och ange teckensnittsnamnet. Låt oss lägga till Calibri och se hur det ändrar teckensnittet i förhandsgranskningen.
   

   

4. om du vill återställa teckensnittet, uppdatera sidan.
   

   

ladda ner: FontFinder för Chrome / Edge / Firefox (Gratis)

vad sägs om att kontrollera teckensnittet i en bild?

om du vill identifiera teckensnitten i en bild kanske webbläsartillägg och webbläsarens Inspektionsverktyg inte hjälper. Du kan dock prova verktyg för bildinspektör online som WhatFontIs, FontSquirrel, Fontspring, WhatTheFont och många andra.

processen för att identifiera ett teckensnitt från en bild är i stort sett densamma i alla verktyg. Låt oss försöka identifiera teckensnittet i en bild med WhatTheFont.

1. om du inte redan har gjort det, ladda ner bilden du vill använda.
2. importera bilden till WhatTheFont.
   

   

3. WhatTheFont kommer automatiskt att upptäcka texten i din bild. Krympa eller förstora beskärningsrutan så att den omger teckensnittet du vill identifiera. Tryck på pilknappen när du är klar.
   

   

4. WhatTheFont matchar sedan teckensnittet i bilden med teckensnitt i sitt galleri och visar dig närbesläktade teckensnitt.
   

   

5. om du inte hittar en bra matchning direkt, du kan fortsätta klicka visa fler resultat för att se fler relaterade teckensnitt.
   

   

Upptäck teckensnitt från webben och använd dem i dina mönster

teckensnitt spelar en viktig roll för framgången för en webbplats eller en grafisk design. Om du snubblar på ett engagerande teckensnitt när du surfar på webben kan du enkelt upptäcka det med hjälp av metoderna ovan.