TTF naar SVG converteren

Op deze pagina zet u een TrueType-lettertype om naar een SVG-font: één XML-bestand waarin elk teken een <glyph>-element is, met de omtrek vastgelegd als SVG-paddata. Dat is handig voor iconfonttools en fonteditors, maar het is iets anders dan een afbeelding van uw tekst.

of sleep TTF, OTF, WOFF …-bestanden hierheen ·

Max. 95 MB per bestand· Tot 20 bestanden· Verwijderd na 30 minuten

Uitvoer

Converteren naar

Bestanden worden op onze servers verwerkt en na 30 minuten verwijderd.

Zo gebruikt u deze tool

1
Upload het TTF-bestand
Voeg een of meer .ttf-bestanden toe, maximaal 20 per batch en elk maximaal 95 MB. Zowel icoonlettertypen als tekstlettertypen werken.
2
Laat SVG-font als uitvoer staan
Converteren naar staat op SVG-lettertype. Hinting is niet van toepassing op SVG-uitvoer, dus die optie verdwijnt; Familienaam onder Geavanceerde instellingen hernoemt het lettertype nog steeds.
3
Converteren naar SVG
Klik op Converteren naar SVG en download het .svg-bestand. Open het in een teksteditor, Inkscape of FontForge om bij de glyphpaden te komen.

SVG-font versus SVG-afbeelding van tekst

Wie zoekt op TTF naar SVG, vindt twee verschillende doelen door elkaar. Het ene is een SVG-lettertype: het lettertypeformaat uit de SVG 1.0-aanbeveling van het W3C uit 2001, waarbij een <font>-element per teken een <glyph> bevat met een Unicode-waarde, een advance width en de contour als pad. Het andere is een SVG-afbeelding van tekst, de letters van een logo of een naam die al op een regel staat en als vormen is opgeslagen. Deze converter maakt de eerste soort. Heb je een logoafbeelding in plaats van een lettertype, dan zet PNG naar SVG die om naar paden.

Het omzetten van een TrueType-contour naar SVG-paddata verliest niets aan vorm. SVG-paden ondersteunen dezelfde kwadratische curven die TrueType gebruikt, dus elke contour wordt zoals hij is weggeschreven. Wat niet behouden blijft, is alles rond de contouren: hinting-instructies, OpenType-features die verder gaan dan simpele kerning, en de binaire tabellen die besturingssystemen nodig hebben om een lettertype te installeren. Een SVG-lettertype kan niet op Windows of macOS worden geïnstalleerd.

Zo ziet een SVG-fontbestand eruit

Verkort voorbeeld van de opmaak in een SVG-lettertype

<svg xmlns="http://www.w3.org/2000/svg">
  <defs>
    <font id="MerkSans" horiz-adv-x="1229">
      <font-face font-family="Merk Sans" units-per-em="2048" ascent="1638" descent="-410" />
      <glyph unicode="L" glyph-name="L" horiz-adv-x="1100" d="M180 0V1456H360V160H1040V0Z" />
    </font>
  </defs>
</svg>

Wat deze pagina maakt: één bestand, één <glyph> per teken, in lettertype-eenheden met de y-as omhoog.

Opent in FontForge, Inkscape en tools voor icoonlettertypen
Niet te installeren op een computer
Wordt niet geladen door huidige versies van Chrome, Edge of Firefox

Een gewoon OTF- of TTF-bestand met een extra SVG-tabel met gekleurde glyphs in lagen.

Geïnstalleerd zoals elk lettertype
Gebruikt voor emoji en meerkleurige letters
Ondersteuning verschilt per app en browser

Waar SVG-fonts vandaan kwamen en waar ze bleven

SVG 1.0 definieert het font-element: 2001
laatste iPhone-Safari die SVG-webfonts nodig had: iOS 4.1
verwijdert SVG-lettertypen in 2014: Chrome 38
laat het hoofdstuk over lettertypen vallen: SVG 2

TTF

TrueType-lettertype

TTF is het TrueType-lettertypeformaat dat Apple eind jaren tachtig ontwikkelde en in 1991 uitbracht, en daarna in licentie gaf aan Microsoft. Het beschrijft glyphcontouren met kwadratische krommen en bevat hinting-instructies die tekst scherp laten ogen op schermen. TrueType wordt ondersteund door elk desktopbesturingssysteem, tekstverwerker en ontwerpprogramma. Het mist enkele geavanceerde typografische functies van OpenType en is groter dan weblettertypeformaten.

Compressie: Zonder verlies
Transparantie: –
Animatie: –
Geïntroduceerd: 1991 · Apple

TTF-converter

SVG

Scalable Vector Graphics

SVG is een op XML gebaseerd vectorformaat dat het W3C in 2001 standaardiseerde. In plaats van pixels beschrijft het vormen, paden en tekst, waardoor het op elk formaat scherp blijft en voor logo's en pictogrammen meestal piepklein is. Het ondersteunt transparantie, CSS-opmaak, scripting en animatie, en elke browser geeft het native weer. SVG is niet geschikt voor foto's, en complexe illustraties kunnen traag worden weergegeven. Illustrator, Inkscape, Figma en browsers kunnen het openen en bewerken.

Compressie: –
Transparantie: Ja
Animatie: Ja
Geïntroduceerd: 2001 · W3C

SVG-converter

TTF naar SVG schrijft de contour van elke glyph als bewerkbare SVG-paddata in een SVG-lettertype, dat door tools voor icoonlettertypen, lettertype-editors en oude webfontkits wordt gebruikt; het is geen manier om lettertypen op moderne webpagina's te laden.

Veelgestelde vragen over TTF naar SVG

Kan ik een SVG-font vandaag nog gebruiken in CSS @font-face?

In de meeste browsers niet. Chrome verwijderde de ondersteuning voor SVG-lettertypen in 2014 in versie 38, en Firefox en Internet Explorer hebben die nooit toegevoegd. Converteer het TTF-bestand voor een website liever met TTF naar WOFF2.

Waarom staan de glyphs ondersteboven als ik ze in een tekening plak?

SVG-lettertypen gebruiken het eigen coördinatenstelsel van het lettertype, waarin de y-as vanaf de basislijn omhoog wijst, terwijl gewone SVG-tekeningen y naar beneden tellen vanaf de bovenkant. Spiegel het pad verticaal, bijvoorbeeld met een scale(1,-1)-transformatie, en het staat goed.

Hoe zet ik tekst om naar SVG-paden voor een Cricut of lasersnijder?

Installeer het TTF-bestand, typ je woorden in Inkscape of Illustrator en zet de tekst om naar contouren: Pad › Object naar pad in Inkscape, Tekst › Contouren maken in Illustrator. Sla dat op als SVG. Een SVG-lettertype bevat elke letter apart en is niet als woorden opgemaakt.

Behouden SVG-fonts kerning en ligaturen?

Slechts gedeeltelijk. Het SVG-lettertypeformaat kan kerningparen opslaan met hkern-elementen en glyphs met meerdere tekens, maar kent geen equivalent van OpenType-featuretabellen zoals kleinkapitalen, alternatieven of contextuele regels. Bewaar het TTF-bestand als je die nodig hebt.

Is een SVG-font nuttig voor iconfonts?

Ja, dat is tegenwoordig het belangrijkste gebruik. Tools voor icoonlettertypen zoals IcoMoon importeren SVG-lettertypen, zodat je iconen uit een oud icoonlettertype kunt halen, bewerken en er een nieuwe set van kunt maken of elk icoon als eigen SVG kunt exporteren.