Skip to content

Alt om WordPress, webutvikling — og mer til

🔤 9 Måter å identifisere en skrifttype fra et bilde og på et nettsted: tjenester, utvidelser og opplasting til et nettsted

🔤 9 Måter å identifisere en skrifttype fra et bilde og på et nettsted: tjenester, utvidelser og opplasting til et nettsted

Du har sett det skje: du surfer på et nettsted og plutselig stopper du opp. Skrifttypen i overskriften er så bra at du allerede ser for deg hvordan den ville sett ut i prosjektet ditt. Men hva heter den? Eieren av nettstedet svarte ikke, kildekoden har obfuskert CSS, og googling etter «fin serif-font med en rar G» kan ta deg til morgenkvisten.

Designere går i denne fellen hele tiden. Å lete gjennom gigabyte med samlinger i håp om et treff er et lotteri. Og hva om skrifttypen ikke er der i det hele tatt?

Heldigvis gir 2026 oss et sett verktøy som løser problemet på sekunder. Noen fungerer med opplastede bilder, andre fungerer direkte på aktive nettsider. Vi dekker 9 måter å identifisere en skrifttype på: fra klassiske tjenester til bokmerker som veier null megabyte.

💡 Rask oversikt:

  • Last opp et skjermbilde med tekst til WhatTheFont eller WhatFontIs, og få navnet på skrifttypen (ofte med et gratis alternativ).
  • Installer utvidelsen Fonts Ninja eller WhatFont, hold musepekeren over tekst på et nettsted og se navn, størrelse, linjehøyde og farge.
  • Har du ikke engang et skjermbilde, åpne Identifont, svar på 5-10 spørsmål om bokstavformer og få et treff.
  • Fant du skrifttypen, last den opp til nettstedet via CSS @font-face (eller en plugin for WordPress) og bruk den.

Nettbaserte tjenester: identifisere skrifttyper fra opplastede bilder

Disse fire verktøyene fungerer etter et felles prinsipp: du gir dem et bilde med tekst, og de kjører det gjennom en database med hundretusenvis av skrifttyper og returnerer treff.

1. WhatTheFont, gullstandarden fra MyFonts

WhatTheFont-grensesnitt: bildeopplasting og resultat av skriftgjenkjenning

WhatTheFont fra MyFonts er den mest nøyaktige skrifttypeidentifikatoren i 2026. Under panseret ligger dyp læring basert på en database med over 233 000 skriftstiler. Last opp et bilde, klikk på teksten, få en liste over treff. Databasen heller mot kommersielle skrifttyper, men tilbyr nesten alltid gratis alternativer også.

Fordeler: utmerket nøyaktighet på standard skrifttyper, mobilapp for iOS og Android, ingen registrering nødvendig. Ulemper: svak på håndskrevne og sterkt stiliserte skrifttyper, innebygd beskjæringsverktøy kutter noen ganger av opp- og underlengder.

🔗 WhatTheFont på MyFonts

2. WhatFontIs, størst database (over 900 000 skrifttyper)

WhatFontIs-grensesnitt: bildeopplasting for skriftsøk i katalog

WhatFontIs har den største databasen, over 900 000 skrifttyper. Kjør den som nummer to hvis WhatTheFont ikke ga et sikkert resultat.

Hovedfunksjon: automatisk utvalg av gratis alternativer fra Google Fonts til betalte treff. For et webbudsjett sparer dette en time med arbeid.

Fordeler: størst indeks, forslag til gratis alternativer, nettleserutvidelse. Ulemper: gratisversjonen er stappfull av annonser, du må merke symboler manuelt før søk.

🔗 WhatFontIs

3. Fontspring Matcherator, treffsikkerhet på OpenType

Fontspring Matcherator-grensesnitt: dra-og-slipp-bilde for skriftidentifikasjon

Fontspring Matcherator er en favoritt blant designere som bruker uavhengige støperier. I motsetning til WhatTheFont (MyFonts-katalogen), dekker Matcherator indie-fonter, oppdager OpenType-funksjoner (ligaturer, alternative glyfer) og støtter dra-og-slipp.

Fordeler: gratis, sterk på web fonts, sammenligning av treff side ved side. Ulemper: databasen er mindre enn MyFonts, sensitiv for bildekvalitet.

🔗 Fontspring Matcherator

4. Font Squirrel, gratis fonter og null reklame

Font Squirrel Matcherator-grensesnitt: skriftidentifikasjon med bilderoteringsmulighet

Font Squirrel bygget sitt rykte på å kuratere gratis fonter for kommersiell bruk. Deres Matcherator er den mest minimalistiske: last opp, beskjær, få resultater. Ingen reklame, ingen popup-vinduer. Signaturfunksjonen er bilderotasjon: hvis fonten står i en vinkel, håndterer Font Squirrel det der andre feiler.

Fordeler: reneste grensesnittet, gratis fonter, raske resultater. Ulemper: databasen er liten, finner nesten aldri kommersielle fonter.

🔗 Font Squirrel Matcherator

Nettleserutvidelser: identifisere fonter direkte på nettsteder

Nettbaserte tjenester er bra for bilder. Men hvis fonten er rett foran deg nå, på en levende nettside, gir nettleserutvidelser deg svaret på sekunder. Ingen skjermbilder, ingen nye faner.

5. Fonts Ninja, prøv, kjøp, last ned

Fonts Ninja-utvidelsesgrensesnitt for å identifisere skrifter på nettsteder

Fonts Ninja (tidligere FontFaceNinja) er den ubestridte lederen blant nettleserbaserte skriftidentifikatorer. Utvidelsen er tilgjengelig for Chrome, Firefox, Safari og Edge.

Før musepekeren over tekst, så ser du skriftnavn, størrelse, linjehøyde, farge og tegnavstand. Men viktigst av alt: Fonts Ninja lar deg prøve skriften. Skriv inn din egen tekst og se den i sanntid i den samme skriften. Og hvis du liker den, laster du ned gratisversjonen umiddelbart eller går videre til kjøp av den kommersielle.

Bonus: en maske-knapp som skjuler alle annonser og bilder på siden, slik at bare typografien står igjen i ren form. For en designer som vurderer layout, er dette uvurderlig.

Fordeler: komplett sett, identifiser, prøv, last ned, fungerer i 4 nettlesere. Ulemper: for avanserte filtre (bokstavformer, lisenstype) trenger du registrering.

🔗 Fonts Ninja på Chrome Nettmarked

6. WhatFont, hold pekeren over og lær alt

WhatFont-utvidelse som viser navnet og CSS-egenskapene til den valgte skriften

WhatFont er en utvidelse anbefalt av Wired og elsket av webutviklere for sin enkelhet. Tilgjengelig for Chrome og Firefox.

Hold musepekeren over teksten, så dukker skriftnavnet opp. Klikk, så får du et komplett kart over CSS-egenskaper: familie, vekt, størrelse, linjehøyde, farge i HEX. Dette er ikke bare en identifikator, det er en typografiinspektør. Hvis skriften er fra Google Fonts-katalogen, gir WhatFont en direkte nedlastingslenke.

Fordeler: umiddelbart resultat, dyp CSS-analyse, lenker til Google Fonts. Ulemper: identifiserer ikke skrifter i bilder (kun levende tekst på siden), lar deg ikke prøve skriften med din egen tekst.

🔗 WhatFont på Chrome Nettmarked

7. Typ.io, skriftparinger og inspirasjon

Typ.io-grensesnitt: liste over skrifter på siden i nettleserens sidepanel

Typ.io løser oppgaven ett skritt videre: det er ikke nok å identifisere skriften, du vil forstå hva den passer sammen med. Etter at du har installert utvidelsen, dukker det opp en «T»-knapp i nettleserhjørnet. Klikk på den, så ser du alle sidens skrifter som en egen liste. Klikk på et navn, så kommer du til skriftkortet med eksempler på paringer: «denne skriften brukes sammen med...»

Selve Typ.io-nettstedet er en database over reelle designbeslutninger: fellesskapet laster opp skjermbilder av nettsteder med nedbrytninger av skriftkombinasjoner. For dem som ikke bare vil finne en skrift, men forstå konteksten for bruken av den.

Fordeler: utvalg av skriftparinger, database med reelle eksempler. Ulemper: utvidelsen viser bare skriftnavn (uten CSS-detaljer), full funksjonalitet krever registrering.

🔗 Typ.io

8. Fount, et bokmerke som veier null

Fount-bokmerke i bruk: identifiserer skrifter ved å klikke på tekst på nettstedet

Fount er ikke en utvidelse, det er et bokmerke. Du legger til en knapp i nettleserens bokmerker, går til et hvilket som helst nettsted, klikker på dette bokmerket, og musepekeren blir til et trådkors. Klikk på tekst, så vises et vindu med skriftnavn, størrelse, vekt og stil. Klikk på bokmerket igjen for å slå av modusen.

Ideelt valg for dem som ikke vil fylle opp nettleseren med utvidelser. Fungerer i Safari, Chrome, Firefox og IE8+. Krever ingen oppdateringer, samler ingen data, bruker ingen bakgrunnsprosesser. Det bare fungerer.

Fordeler: ultralett, på tvers av plattformer, ingenting å installere. Ulemper: identifiserer bare det som faktisk ble rendret i skriftstakken (ikke det som er tiltenkt i CSS), ingen detaljer som farge.

🔗 Fount, legg til bokmerke

Spesialmetode: når det ikke finnes bilde eller nettsted

9. Identifont, identifisering av fonter ved beskrivelse

Identifont-grensesnitt, identifiserer skrifter gjennom spørsmål om bokstavformer

Identifont er det eldste verktøyet i denne samlingen (siden 2000), men fortsatt uunnværlig. Det tar ikke imot bilder og skanner ikke nettsteder. I stedet stiller det spørsmål: har bokstaven «Q» seriffer? Er løkkene i liten «g» sammenhengende? Hvordan ser «&»-tegnet ut?

Du svarer på 5-10 spørsmål, Identifont snevrer inn sirkelen og gir et treff. Høres arkaisk ut, men det er den eneste fungerende metoden når du verken har et skjermbilde eller en URL, bare et minne om hvordan fonten så ut.

Fordeler: fungerer helt uten bilde, trener det typografiske øyet. Ulemper: tregt (5+ minutter å søke), nettstedets design har ikke vært oppdatert på flere tiår, databasen er underlegen moderne tjenester.

🔗 Identifont

Sammenligningstabell: hva du bør velge

Verktøy

Type

Gratis?

Fontdatabase

Nøyaktighet

Unik funksjon

WhatTheFont

Nettbasert tjeneste

Ja

233 000+

Høy

Mobilapp

WhatFontIs

Nettbasert tjeneste

Ja (gratisversjon)

900 000+

Middels til høy

Gratis alternativer fra Google Fonts

Fontspring Matcherator

Nettbasert tjeneste

Ja

Middels

Høy

Gjenkjenning av OpenType-funksjoner

Font Squirrel

Nettbasert tjeneste

Ja

Liten

Middels

Billedrotasjon

Fonts Ninja

Utvidelse

Ja

Middels

Høy

Prøv fonten med din egen tekst

WhatFont

Utvidelse

Ja

Liten

Høy

Full CSS-analyse

Typ.io

Utvidelse

Ja

Middels

Middels

Valg av fontpar

Fount

Bokmerke

Ja

Ikke relevant

Middels

Null vekt, ingenting å installere

Identifont

Nettbasert quiz

Ja

Liten

Middels

Fungerer uten bilde

Det finnes ikke ett eneste perfekt verktøy. Pro-oppskrift: last opp bildet til WhatTheFont, ta en ny runde med Fontspring Matcherator, og se på snittet. Navnet som går igjen, er fasiten.

Slik laster du opp fonten du fant, til et nettsted

Font Squirrel Webfont Generator-grensesnitt: konverterer skrift til webformater

Du har identifisert fonten, lastet ned filen, og nå må du legge den til på nettstedet. Den mest universelle metoden er @font-face.

Trinn 1. Last ned fonten i .ttf- eller .otf-format.

Trinn 2. Konverter til webformater via Font Squirrel Webfont Generator. Resultatet gir deg .woff, .woff2 og .ttf, pluss en ferdig CSS-fil. WOFF2 er hovedformatet for web i 2026, det støttes av 98% av nettleserne.

Trinn 3. Last opp fontfilene til serveren via FTP eller hosting-filbehandler, til mappen /wp-content/themes/your-theme/fonts/.

Trinn 4. Skriv @font-face i CSS:

1@font-face {
2 font-family: 'MyCustomFont';
3 src: url('fonts/MyCustomFont.woff2') format('woff2'),
4 url('fonts/MyCustomFont.woff') format('woff');
5 font-weight: 400;
6 font-style: normal;
7 font-display: swap;
8}

Direktivet font-display: swap er kritisk: nettleseren viser først systemfonten, og når den egendefinerte lastes inn, bytter den den ut. Uten dette vil teksten være usynlig til fonten er lastet ned.

Trinn 5. Bruk fonten på elementer:

1h1, h2, h3 {
2 font-family: 'MyCustomFont', sans-serif;
3}

WordPress: utvidelsen Custom Fonts gir et visuelt grensesnitt for å laste opp alle typer fonter. Eller skriv @font-face i barnetemaets functions.php via wp_head-hooken.

Før du redigerer temafiler, ta en sikkerhetskopi. En feil i @font-face eller functions.php kan knekke nettstedet.

Se en kort video som viser hele prosessen, fra skjermbilde til ferdig fontnavn, med WhatTheFont:

⁉️🤔 Ofte stilte spørsmål

Hvorfor finner ikke WhatTheFont fonten min?

Tre hovedgrunner: dårlig bildekvalitet, teksten er rotert i en vinkel, eller fonten er håndskrevet. Ta et større skjermbilde, på en kontrasterende bakgrunn og horisontalt. Hjalp det ikke, prøv Fontspring Matcherator og WhatFontIs. For håndskrevne fonter finnes det ofte ikke et eksakt treff i utgangspunktet: de er unike.

Kan du identifisere en font fra en PDF-fil?

Ja, hvis teksten ikke er rasterisert. Åpne PDF-en, marker teksten og ta et skjermbilde. Last opp til en hvilken som helst tjeneste fra de fire første. For skannede dokumenter avhenger resultatet av oppløsningen: 150 DPI og høyere gir akseptabel nøyaktighet.

Fonten ble identifisert, men den koster penger. Hvor får jeg et gratis alternativ?

WhatFontIs tilbyr automatisk gratis alternativer fra Google Fonts under hvert betalte treff. Manuelt: gå til fonts.google.com, skriv inn navnet på fonten du fant, og se på visuelt like fonter. Gratis erstatninger: med seriffer, Playfair Display, Lora, Merriweather; uten seriffer, Inter, Roboto, Manrope.

Hvilket fontformat bør jeg bruke for web i 2026?

WOFF2 er hovedformatet, WOFF er reserveløsning for eldre nettlesere. TTF og OTF bør ikke brukes på web: de veier 2-3 ganger mer uten komprimering. Font Squirrel-generatoren (nevnt over) konverterer alt til WOFF2+WOFF med ett klikk.

Hva du bør bruke i 2026: endelig oversikt

Ni verktøy betyr ikke at du må bruke alle. Her er en enkel utvalgsmatrise:

  • Har et skjermbilde → WhatTheFont, deretter Fontspring Matcherator for dobbeltsjekk.
  • Trenger et gratis alternativ → WhatFontIs (automatisk utvalg fra Google Fonts).
  • Font på et aktivt nettsted → Fonts Ninja eller WhatFont (utvidelse på 5 sekunder).
  • Ingenting tilgjengelig, bare hukommelsen → Identifont.
  • Ønsker ikke å installere utvidelser → Fount (bokmerke i bokmerkene).

Og hvis ingen verktøy fungerte, åpne DevTools (F12 → Inspiser → Computed → font-family). Upraktisk, men pålitelig. Og ingen har avlyst subredditen r/identifythisfont: levende designere navngir fonten i løpet av et par minutter.

En god font endrer oppfatningen av et nettsted raskere enn å bygge om tre blokker. Nå har du alt du trenger for å finne den ene og sette den inn i prosjektet ditt.