Bildkonverterare


Gratis teckensnitt - populära webbplatser, liveförhandsvisningar och hur man använder dem

Bläddra bland betrodda källor för gratis typsnitt, testa liveförhandsvisningar, kopiera ren CSS och lär dig hur du använder webbteckensnitt. Samlingar med öppen källkod, gratis för kommersiellt bruk och personligt bruk ingår.

Google Fonts

OFL

Det största biblioteket med öppen källkod med snabb global CDN, delmängder och variabla teckensnitt. Idealisk för webb och appar. De flesta familjer använder SIL Open Font License.

WebfontVariabelKommersiellt OK*
Besök

Fontshare (av ITF)

Gratis

Kvalitetstypsnitt som erbjuds gratis av Indian Type Foundry. Rena familjer, enkel CDN-inbäddning och många olika alternativ.

WebfontVariabel
Besök

Font Ekorre

Gratis reklam

Kurerad katalog fokuserad på gratis-för-kommersiell användning typsnitt. Inkluderar en webbfontgenerator för självvärd.

Kommersiellt OK*Generator
Besök

The League of Moveable Type

OFL

Klassiskt gjuteri med öppen källkod med tidlösa familjer som League Spartan och Raleway. Perfekt för branding och redaktionell.

Öppen källkodBranding
Besök

Velvetyne

OFL

Experimentella typsnitt med öppen källkod med distinkta visningsstilar. Perfekt för affischer, kultur och kreativt arbete.

VisaExperimentell
Besök

Kollektiv

OFL

Gemenskapsgjuteri släpper gratis typsnitt av hög kvalitet under öppna licenser. Starka redaktionella och visningsalternativ.

Öppen källkodRedaktionell
Besök

Öppna Gjuteri

OFL

Kurerat teckensnittsindex med öppen källkod med testverktyg och designcentrerad presentation. Perfekt för att upptäcka fräscha familjer.

Besök

1001 teckensnitt

Blandade licenser

Stor katalog med filter för gratis för kommersiellt bruk. Läs licensen per familj; många är endast för personligt bruk.

Besök

DaFont

Personligt bruk

Enormt arkiv bäst för personliga projekt och inspiration. Licenserna varierar kraftigt; kontrollera varje nedladdningssida.

Besök

Ikonteckensnitt (Font Awesome, Material Icons, Remix Icon)

Gratis nivåer

För UI-ikoner som använder en teckensnittspipeline. Överväg moderna SVG-ikonsystem, men ikonteckensnitt är fortfarande användbara för snabba tillägg.

UICDN
Typsnitt fantastiskt Material ikoner Remix ikon

Live Preview och CSS Snippets

Endast lokalt – inget laddat upp
The quick brown fox jumps over the lazy dog. 0123456789
teckensnittsfamilj: Inter, sans-serif; font-weight: 600;

Funktionsjämförelse (ögonblicksbild)

Licenser varierar beroende på familj
Plats Öppen källkod Gratis reklam Variabla teckensnitt CDN/Webfonts Anteckningar
Google FontsJaJa*JaJaStörsta biblioteket, snabb CDN
FontshareBlandadJaMångaJaModerna familjer
Font EkorreBlandadJa*NågraGeneratorUtarbetad för kommersiellt bruk
League of Moveable TypeJaJaNågraSjälvvärdTidlösa klassiker
VelvetyneJaJaNågraSjälvvärdExperimentell visning
DaFontIngaVarierarFåIngaPerfekt för personliga projekt

Hur man använder gratis teckensnitt på webben

  1. Kontrollera licensen: OFL och andra tillåtande licenser är bäst för kommersiella projekt. Vissa webbplatser listar teckensnitt för endast personlig användning.
  2. Välj leverans: CDN-länk för hastighet, eller självvärd med @font-face för kontroll och integritet.
  3. Förladda kritiska typsnitt för din hjältetext om CLS är ett problem; definiera reservstackar för att undvika blixtar.
  4. Föredrar variabla typsnitt när de är tillgängliga för att minska förfrågningar och få flexibla vikter.

CDN-exempel

<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap" rel="stylesheet">
<style>
  body{ font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; }
</style>

Självvärd Exempel

@font-face{
  font-family: "MyFont";
  src: url("/fonts/MyFont-Variable.woff2") format("woff2");
  font-display: swap;
}
body{ font-family: "MyFont", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; }

* Verifiera alltid varje familjs licens på källwebbplatsen.

Vanliga frågor

Är Google Fonts gratis för kommersiellt bruk?

De flesta släpps under OFL och är gratis för kommersiellt bruk. Bekräfta licensen på varje familjesida.

Ska jag använda ikonteckensnitt eller SVG-ikoner?

SVG-ikoner är mer flexibla för moderna appar. Ikonteckensnitt förblir användbara för snabba inställningar eller äldre pipelines.

Påverkar webbteckensnitt webbplatsens hastighet?

Ja. Använda font-display: swap, undergrupp där det är möjligt, och begränsa familjer och vikter.

Vilket är det bästa typsnittet för allmänna ändamål?

Inter, Roboto och Source Sans 3 är mångsidiga. Kombinera med en serif som Merriweather eller Playfair för rubriker.