Website Font Extractor.

Was ist ein Font Extractor?

Ein Font Extractor (Schriftart-Extraktor) ist ein Online-Tool, das die Schriften einer Webseite findet und dir direkten Zugriff auf die dahinterliegenden Schriftdateien gibt. Statt eine Schrift nach Augenmaß zu raten, fügst du einen Link ein und erhältst eine genaue Liste der Schriftfamilien, Stärken, Stile und Dateiformate, die die Website lädt. FontExtractor ist ein kostenloser Website-Font-Extractor, der genau das in wenigen Sekunden erledigt – mit Live-Vorschau und Download per Klick.

Moderne Websites verlassen sich selten auf die wenigen Schriften, die auf jedem Computer installiert sind. Sie laden eigene Webfonts über CSS-@font-face-Regeln – von Google Fonts, Adobe Fonts, einem CDN oder dem eigenen Server. Diese Regeln verteilen sich auf viele Stylesheets, verschachtelte @import-Anweisungen und Inline-<style>-Tags. Sie von Hand zu finden ist mühsam – ein Font Extractor liest sie alle für dich aus.

FontExtractor auf einen Blick

So nutzt du den Font Extractor per URL

Schriftarten mit unserem Font Extractor per URL zu extrahieren, dauert weniger als eine Minute:

1. Kopiere die Adresse der Seite, deren Typografie du untersuchen willst. Jede öffentliche Seite funktioniert, nicht nur die Startseite.
2. Füge sie in das Feld oben auf dieser Seite ein und klicke auf Schriften extrahieren. https:// kannst du weglassen – wir ergänzen es automatisch.
3. Prüfe die Ergebnisse. Jede Schriftfamilie erscheint als Karte in ihrer eigenen Schrift, darunter alle Stärken und Stile.
4. Teste eigenen Text im Vorschaufeld und passe die Größe an, um die Schrift in Überschriften und Fließtext zu beurteilen.
5. Herunterladen oder kopieren. Speichere einzelne Dateien, lade das komplette Set als ZIP mit passender fonts.css herunter oder kopiere das @font-face-CSS einer Familie.

Welche Schriften kann ein Website-Font-Extractor erkennen?

FontExtractor erkennt die Schriften, die eine Seite in HTML und CSS deklariert: selbst gehostete Dateien, Google Fonts, Adobe Fonts, variable Schriften und per Base64 eingebettete Schriften, in den Formaten WOFF2, WOFF, TTF, OTF, EOT und SVG.

FontExtractor geht denselben Weg wie ein Browser beim Rendern einer Seite. Er lädt das HTML, findet jedes verlinkte Stylesheet (auch die Lade-Tricks preload und print-then-all performanceoptimierter Seiten), folgt @import-Ketten über mehrere Ebenen und wertet jeden @font-face-Block aus. Erkannt werden:

• Selbst gehostete Schriften von der eigenen Domain oder dem CDN der Website.
• Google Fonts inklusive jedes Unicode-Subsets wie latin, latin-ext oder cyrillic.
• Adobe Fonts (Typekit) und andere Schriftdienste, die per CSS ausgeliefert werden.
• Variable Fonts mit ihrem vollen Stärkebereich, zum Beispiel 100–900.
• Eingebettete base64-Schriften, die als data:-URI direkt im Stylesheet stehen.
• Vorgeladene Schriften, deklariert mit <link rel="preload" as="font">.
• Alle gängigen Formate: WOFF2, WOFF, TTF, OTF, EOT und SVG. Bietet eine Regel mehrere Formate an, wird automatisch das effizienteste gewählt.

Neben herunterladbaren Dateien zeigt das Tool auch die Font-Stacks, die das CSS anfordert. So erkennst du, ob eine Website auf Systemschriften wie -apple-system, Segoe UI oder Helvetica Neue setzt – diese kann kein Font Extractor herunterladen, weil sie auf dem Gerät der Besucher liegen.

Warum Designer und Entwickler Schriften extrahieren

Typografie prägt die Persönlichkeit einer Marke – deshalb gehört „Welche Schrift ist das?“ zu den häufigsten Fragen im Design. In diesen Situationen spart ein Font Extractor am meisten Zeit:

• Inspiration und Recherche. Erstelle Moodboards und vergleiche, wie führende Produkte Überschrift- und Textschriften kombinieren.
• Frontend-Entwicklung. Baue Layouts originalgetreu nach, debugge eine Schrift, die nicht lädt, oder prüfe, welche Formate ausgeliefert werden.
• Marken-Audits. Stelle sicher, dass jede Seite deiner Website die freigegebenen Schriften lädt – und keine vergessenen Altdateien.
• Performance-Checks. Finde Seiten, die zu viele Schnitte laden oder noch schwere TTF-Dateien statt WOFF2 ausliefern.
• Kundenprojekte. Weiß ein Kunde nicht mehr, welche Schriften die alte Website nutzte, findet der Extractor sie in Sekunden.

Darfst du Schriften verwenden, die du aus einer Website extrahierst?

Dass du eine Schriftdatei herunterladen kannst, heißt nicht, dass du sie auch verwenden darfst. Schriften sind Software, und die meisten kommerziellen Schriften werden pro Website, pro App oder nach Seitenaufrufen lizenziert. Viele Webfonts sind Open Source – fast alles bei Google Fonts steht zum Beispiel unter der SIL Open Font License –, Premium-Familien von Schriftgießereien oder Adobe Fonts sind jedoch nur für die Website lizenziert, die sie gekauft hat.

Nutze FontExtractor, um Schriften zu identifizieren, zu bewerten und lokal zu testen. Prüfe vor der Veröffentlichung in deinem eigenen Projekt die Lizenz und kaufe die Schrift bei Bedarf bei der Schriftgießerei. Wer Schriftgestalter unterstützt, sorgt dafür, dass weiterhin großartige neue Schriften entstehen.

Font Extractor vs. DevTools und Browser-Erweiterungen

Nutze einen Online-Font-Extractor, um alle Schriften einer Seite auf einmal aufzulisten. Nutze die DevTools des Browsers oder eine Erweiterung für Seiten hinter einem Login oder für Schriften, die per JavaScript hinzugefügt werden.

Mit den Entwicklertools des Browsers kannst du Schriften auch manuell finden: Element untersuchen, den Bereich Computed öffnen und im Tab Network nach Font-Anfragen suchen. Für ein einzelnes Element klappt das, wird aber schnell mühsam, wenn eine Website mehrere Familien, Unicode-Subsets und variable Fonts nutzt. Browser-Erweiterungen helfen, brauchen aber eine Installation und Berechtigungen für jede besuchte Seite – und zeigen meist nur die Schrift des Elements unter dem Mauszeiger.

Ein Online-Font-Extractor braucht keine Installation, funktioniert auf jedem Gerät – auch auf Smartphones und Tablets – und liefert das komplette Schrifteninventar einer Seite auf einmal, mit Vorschau, sauberen Dateinamen und herunterladbarem CSS.

Tipps für die besten Ergebnisse

Für die besten Ergebnisse scanne genau die Seite, die dich interessiert, und probiere direkt die URL eines ihrer Stylesheets, wenn keine Schriften erscheinen.

• Analysiere genau die Seite, die dich interessiert. Landingpages, Blogs und Dokumentationen laden oft unterschiedliche Schriften.
• Liefert eine Website keine Schriften, erzeugt sie ihre Styles womöglich erst per JavaScript. Analysiere dann direkt die URL eines ihrer Stylesheets.
• Manche Websites blockieren automatisierte Anfragen mit Bot-Schutz. Schlägt eine Analyse fehl, versuche es später erneut oder nimm eine andere Seite derselben Domain.
• Setze im Web auf WOFF2-Dateien: Sie sind am kleinsten und werden von allen modernen Browsern unterstützt.
• Behalte die unicode-range-Regeln aus dem kopierten CSS, damit Browser nur die benötigten Subsets laden.

Neugierig, welche Schriften deine Lieblingswebsite verwendet? Scroll nach oben, füge den Link ein und lass den Font Extractor die Arbeit machen.