Base64 in Schrift

So dekodieren Sie eine Base64-Schrift

1. Fügen Sie in Base64 oder Data-URI eines davon ein: reines Base64, eine Data-URI wie data:font/woff2;base64,d09GMg… oder CSS, das eine enthält. Bei mehreren src-Einträgen in einer Regel wird die erste Data-URI verwendet.
2. Die Vorschau zeigt die Schrift mit dem Pangramm „The quick brown fox jumps over the lazy dog 0123456789“ und einer Zeile mit dem ganzen Alphabet. Tippen Sie in Beispieltext, um eigene Wörter auszuprobieren.
3. Die Infoliste zeigt, was die Schriftdatei über sich selbst sagt: Schriftfamilie, Stil, Vollständiger Name, Version, Glyphen und Einheiten pro Em.
4. Drücken Sie Datei herunterladen, um sie mit der Endung ihres Formats zu speichern.

Die Statuszeile unter den Infos lautet „Mit der dekodierten Schrift dargestellt.“, wenn der Browser die Schrift akzeptiert hat. Die Schrift wird unter einem privaten Namen nur für diese Seite registriert und wieder entfernt, sobald Sie etwas anderes dekodieren; die Content Security Policy der Seite erlaubt keinen Netzwerkverkehr außer dem Seitenaufrufzähler von Cloudflare, die Datei geht also nirgendwohin.

Formate und was das Tool daraus liest

Bei WOFF2 steht in der Zeile für die Familie „nicht gelesen (WOFF2-Tabellen sind Brotli-komprimiert)“: Die Seite entpackt Brotli nicht selbst, und die Font-Engine des Browsers, die es kann, behält das Ergebnis für sich. Die Darstellung ist davon nicht betroffen, Sie sehen also trotzdem, ob die Schrift richtig aussieht. Um die Namen nach dem Speichern zu lesen, kommt fc-scan aus fontconfig mit WOFF2 zurecht:

fc-scan --format "%{family}: %{style}\n" font.woff2

Für die Schrift Material Icons gibt das Material Icons: Regular aus.

Wenn die Schrift nicht dargestellt wird

„Ihr Browser hat diese Schrift abgelehnt. Sie ist möglicherweise beschädigt oder keine Schrift.“ bedeutet, dass der Font-Sanitizer des Browsers die Datei verweigert hat. Chrome und Firefox prüfen jeden Webfont vor der Verwendung auf Strukturfehler, und eine Schrift, die abgeschnitten oder an der falschen Stelle aus einer größeren Datei herausgeschnitten wurde, fällt durch. Vergleichen Sie die dekodierte Größe mit dem Original; eine Base64-Zeichenkette, der das Ende fehlt, ergibt eine Schrift mit kaputter letzter Tabelle.

Zeigt die Infoliste die Namen, aber das Beispiel bleibt leer, hat die Schrift keine Glyphen für das, was Sie getippt haben. Das passiert bei:

• Icon-Fonts: Ihre Symbole liegen auf Codepunkten aus dem privaten Bereich, etwa ab U+E000. Schriften mit Ligaturen, darunter Material Icons, zeigen ein Icon, wenn Sie seinen Namen tippen, zum Beispiel home.
• Subset-Fonts: Webseiten betten oft nur die Zeichen ein, die sie brauchen, manchmal ein paar Dutzend. Glyphen zeigt, wie viele die Datei enthält.
• Schriften für andere Schriftsysteme: Eine Schrift für Arabisch oder Devanagari hat womöglich keine lateinischen Buchstaben.

Sind die Daten überhaupt keine Schrift, nennt der Hinweis das Format: „Erkannt: PDF, erwartet: Schrift.“ und so weiter, mit einer passenden Download-Schaltfläche.

Woher Base64-Schriften kommen

Meist aus CSS. Build-Tools betten kleine Schriften als data:-URIs in Stylesheets ein, und HTML-Exporte als Einzeldatei, Offline-Berichte und SVG-Dateien mit Text tragen ihre Schriften auf dieselbe Weise. Das Einbetten hat einen Preis, denn eine eingebettete Schrift lässt sich nicht getrennt vom Stylesheet cachen; Details unter Performance von Data-URIs. Um aus einer Schriftdatei eine solche Regel zu machen, nutzen Sie Schrift in Base64.

Alle Schriften aus einem Stylesheet in Python extrahieren

Das Tool dekodiert die erste gefundene Data-URI. Bei einem Stylesheet mit mehreren eingebetteten Schriften speichert ein kurzes Skript alle mit der richtigen Endung:

import base64, re

SIGNATURES = {b"wOF2": "woff2", b"wOFF": "woff", b"OTTO": "otf", b"\x00\x01\x00\x00": "ttf", b"ttcf": "ttc"}

css = open("icons.css").read()
pattern = r"data:[^;,]*(?:;[^;,]*)*;base64,([A-Za-z0-9+/=\s]+)"
for i, b64 in enumerate(re.findall(pattern, css)):
    data = base64.b64decode(b64)
    ext = SIGNATURES.get(data[:4], "bin")
    with open(f"font-{i}.{ext}", "wb") as f:
        f.write(data)
    print(f"font-{i}.{ext}", len(data), "bytes")

Die Endung ergibt sich aus den ersten vier Bytes, weil Stylesheets Schriften oft ungenau kennzeichnen (application/font-woff, application/octet-stream). Mehr unter Base64 in Python.

Häufige Fragen