Text in SVG umwandeln
Ein SVG mit einem <text>-Element hängt davon ab, dass die Schrift dort verfügbar ist, wo es geöffnet wird. Wandeln Sie den Text in Pfaddaten um, und diese Abhängigkeit verschwindet: Die Formen reisen mit der Datei, sie stellt sich also in jedem Browser, Editor und Schneidplotter identisch dar — ohne eine einzige Webfont-Anfrage.
Text in SVG umwandelnWas Sie zurückbekommen
Ein Pfad pro Glyphe, mit der Füllregel, Füllung und Kontur, die Sie eingestellt haben, und optional eine eigene id je Glyphe, damit Sie Buchstaben einzeln per CSS oder JavaScript ansprechen können. Verschweißen Sie die Konturen stattdessen, wenn Sie einen einzigen Pfad für das ganze Wort wollen — die Form, die ein Schneidplotter oder ein Icon-System meist bevorzugt.
Korrektes Textlayout, nicht bloß Glyphensuche
Der Text wird mit HarfBuzz gesetzt, der Engine, die Browser selbst verwenden: Kerning-Paare und Ligaturen greifen, und komplexe Schriftsysteme verhalten sich richtig — arabische Buchstaben verbinden sich, indische Cluster stellen sich um. Auch Variable-Font-Achsen und OpenType-Funktionen liegen offen, sodass sich ein Schnitt oder ein Stilsatz vor dem Umwandeln einstellen lässt.
Verwenden Sie Ihre eigene Schrift
Der Katalog umfasst über 1.900 Open-Source-Familien, und Sie können stattdessen Ihre eigene TTF oder OTF hineinziehen. Hochgeladene Schriften werden im Tab gelesen und nie irgendwohin gesendet — was auch heißt, dass eine lizenzierte Kaufschrift auf Ihrem Rechner bleibt.
Fragen
- Warum den Text nicht einfach als <text> lassen?
- Weil er sich kein zweites Mal gleich darstellt. Eine fehlende Schrift wird stillschweigend ersetzt, und ein Webfont bringt eine Anfrage und ein Aufblitzen ungestylten Textes mit. Pfade sind feste Geometrie — das lohnt sich immer, wenn die Datei ein Logo, ein Icon oder für eine Maschine bestimmt ist.
- Bleibt der Text durchsuchbar oder barrierefrei?
- Nach dem Umwandeln nicht mehr. Halten Sie den Wortlaut in einem aria-label oder einem title-Element Ihres Markups fest und bewahren Sie eine editierbare Quelle für spätere Änderungen auf.
- Kann ich meine eigene lizenzierte Schrift verwenden?
- Ja — laden Sie eine TTF oder OTF hoch. Sie wird im Browser gelesen, die Datei verlässt Ihren Rechner also nie. Prüfen Sie, ob die Lizenz das Umwandeln in Pfade für Ihren Zweck erlaubt.