(Pixelmator) Wie Text/Font aus SVG Logo erstellen

[CaptainPighead]

Hallo zusammen,

ich bin leider schon sehr lange raus aus meinen Web- und Designthemen, möchte aber versuchen zu einem bestehenden Logo noch einen kleinen Text hinzuzufügen (ist für ein OpenSource Projekt). Das Logo habe ich nicht erstellt und es liegt als SVG vor. Ich weiss nicht, welcher Font benutzt wurde.

Ich habe Pixelmator Pro unter macOS - gibt es eine Möglichkeit aus dem SVG heraus den Font zu ermitteln? Das Logo ist ein Text mit 5 verschiedenen Buchstaben - müsste ich mir aus diesen Buchstaben des SVGs heraus selbst die neuen Buchstaben die ich für den Zusatztext brauche, selber "bauen"?

Ihr merkt schon, ich bin kein wirklicher Designer und habe auch nur rudimentäre praktische Erfahrung mit Pixelmator (nutze es eher für Bildbearbeitung). Ich will es aber trotzdem versuchen ...

Hat jemand mit mehr Design-Erfahrung (idealerweise mit Pixelmator) einen Tip wie ich vorgehen sollte?

 

[kicos018]

Sofern es kein Custom-Font im Logo ist kannst du versuchen über irgendeinen Font Finder die Schriftart herauszufinden.

https://www.myfonts.com/de/pages/whatthefont
https://www.fontspring.com/matcherator

Wenn der Text einen Claim o.ä. darstellt spricht aber auch nichts dagegen eine andere Schriftart zu nehmen.

 

[CaptainPighead]

Danke für den Tip - hab zwar kein direktes Match gehabt, aber ein, zwei Fonts die sehr ähnlich aussehen. Leider kommerzielle Fonts für 50€, da bin ich raus. Ich spiele dann mal etwas mit anderen Fonts rum - danke erstmal bis hierhin!

@kicos018 : kennst Du dich evtl. näher mit Pixelmator aus? Weisst Du, ob es eine Möglichkeit gibt einen Gradient / Farbverlauf einer Füllung von einem SVG Vektor auf einen anderen SVG Vektor zu klonen / kopieren?

Das Logo was ich oben beschrieb hat einen Gradient im SVG. Wird der exakte Gradient mitgespeichert, so dass ich diesen kopieren, bzw. übertragen kann auf meinen "Claim" den ich hinzufügen will (in Pixelmator)?

 

[K-551]

Du kannst die gefundenen Fonts auch einfach mal suchen. Oftmals gibts die woanders für lau.
Oder eine sehr ähnliche freie Version. Google bietet da ne sehr große Anzahl freier Fonts...

Zum eigentl. Thema:
Du kannst den Font ncht aus der SVG extrahieren. Da ist einfach kein Font eingebettet. Der Font wurde einfach in eine Vektorgrafik umgewandelt und ist in der svg "verschwunden". Das ist nicht mehr nachvollziehbar. du bräuchtst schon die originale Datei um das heraus zu bekommen. Oder den Kontakt zum ursprünglichen Designer...
Sonst bleibt dir nur das suchen und vergleichen.
Alternative zu den von @kicos018 genannten ist auch noch whatfontis.com
Auch KI-Assistenten können ggf. helfen...

Wenn du willst kannst du mr die SVG (oder den link dazu) auch mal geben, dann kann ich auch mal gucken...
Hab auch schon div. Fonts ausfindig gemacht.

 

[kicos018]

@CaptainPighead
Habe leider keine Ahnung von dem Programm, das kopieren von einem Farbverlauf sollte aber definitiv möglich sein. Wie gut das funktioniert hängt dann aber damit zusammen, wie die Pfade in der SVG erstellt und abgespeichert wurden.
Mit sehr hoher Wahrscheinlichkeit muss da händisch nachjustiert werden. Pauschal kann man da jetzt keine Anleitung geben.

 

[CaptainPighead]

Danke Euch beiden für die Rückmeldung! @K-551 ich melde mich bei Dir noch mal per PM - mega nett von Dir! 👍

 

[foofoobar]

@kicos018 : kennst Du dich evtl. näher mit Pixelmator aus? Weisst Du, ob es eine Möglichkeit gibt einen Gradient / Farbverlauf einer Füllung von einem SVG Vektor auf einen anderen SVG Vektor zu klonen / kopieren?

svg ist xml also ascii-text, schau da mal mit einem Text-Editor deiner Wahl rein, möglicherweise ist das dort einfach zu finden und zu kopieren.

 

[CaptainPighead]

Danke für den Hinweis @foofoobar . Ich glaube mittlerweile, dass es ein kommerzieller, Lizenz-Font ist. Folgendes ist im Source des SVG - wirst Du daraus schlau, welchen Namen der Font hat?

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
        xmlns:dc="http://purl.org/dc/elements/1.1/"
        xmlns:cc="http://creativecommons.org/ns#"
        xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
        xmlns="http://www.w3.org/2000/svg"
        xmlns:xlink="http://www.w3.org/1999/xlink"
        xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
        xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
        inkscape:version="1.0 (4035a4fb49, 2020-05-01)"
        sodipodi:docname="logo.svg"
        id="svg6"
        style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"
        xml:space="preserve"
        version="1.1"
        viewBox="0 0 600 270"
        height="100%"
        width="100%"><metadata
   id="metadata12"><rdf:RDF><cc:Work
       rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
        rdf:resource="http://purl.org/dc/dcmitype/StillImage"/><dc:title></dc:title></cc:Work></rdf:RDF></metadata>
    <defs
            id="defs10"><linearGradient
     id="linearGradient18"
     inkscape:collect="always"><stop
       id="stop14"
       offset="0"
       style="stop-color:#ff7413;stop-opacity:1;" /><stop
            id="stop16"
            offset="1"
            style="stop-color:#ffa100;stop-opacity:1;"/></linearGradient>
        <linearGradient
                gradientUnits="userSpaceOnUse"
                y2="1929.1329"
                x2="1890.385"
                y1="2095.51"
                x1="1889.2"
                id="linearGradient20"
                xlink:href="#linearGradient18"
                inkscape:collect="always"/></defs>
    <sodipodi:namedview
            inkscape:current-layer="svg6"
            inkscape:window-maximized="0"
            inkscape:window-y="31"
            inkscape:window-x="53"
            inkscape:cy="150"
            inkscape:cx="300"
            inkscape:zoom="2.0483333"
            showgrid="false"
            id="namedview8"
            inkscape:window-height="1028"
            inkscape:window-width="1744"
            inkscape:pageshadow="2"
            inkscape:pageopacity="0"
            guidetolerance="10"
            gridtolerance="10"
            objecttolerance="10"
            borderopacity="1"
            bordercolor="#666666"
            pagecolor="#ffffff"/>
    <g
            id="g4"
            transform="matrix(1,0,0,1,-1612.86,-1862.27)">
        <path
                id="path2"
                style="fill:url(#linearGradient20);fill-rule:nonzero;fill-opacity:1"
                d="M1913.............."/>
    </g>
</svg>

 

[K-551]

Das eine einfacher gerader Verlauf von ff7413 ■ zu ffa100 ■. Das kann (nahezu) jedes Grafik oder Vektor-Programm...

 

[CaptainPighead]

Danke Dir - Du meinst damit den Gradient (Farbverlauf), richtig? Aber welches der genaue Fontname ist, ist aus dem Source nicht ersichtlich, oder?

 

[foofoobar]

@CaptainPighead Wenn ich die anderen Beiträge richtig verstanden habe sind typischerweise nur die fertig gerenderten Font-Daten enthalten, eine Wurst kann man ja typischerweise nicht mehr mit dem Vornamen des Schweins anreden.

 

[CaptainPighead]

😂 Nette Analogie ... ja, kein Ding. War mir nicht sicher - ich bin auf dem Gebiet leider echt Laie. Also ist die einzige Möglichkeit im Grunde mit den Webtools zur Fonterkennung, die hier schon genannt wurden. Alles klar!

 

[simpsonsfan]

Aber welches der genaue Fontname ist, ist aus dem Source nicht ersichtlich, oder?

Aus dem geposteten nicht, nein.
Du kannst ggf. mal die komplette Datei posten (bei dem Auszug hier ist in Zeile 67 der Path fehlerhaft.)

Aber normalerweise würde man (wie foofoobar schreibt) bei einer svg (damit sie portable wird) nicht die Font hinterlegen, sondern die einzelnen Pfade. Sonst öffnet jemand anders, der die Schriftart nicht hat, das File und sieht was ganz anderes.

Du kannst die svg auch einfach nach "font" durchsuchen. Wenn das nicht vorkommt, ist keine Schriftartinfo drin.

 

[foofoobar]

😂 Nette Analogie ... ja, kein Ding. War mir nicht sicher - ich bin auf dem Gebiet leider echt Laie. Also ist die einzige Möglichkeit im Grunde mit den Webtools zur Fonterkennung, die hier schon genannt wurden. Alles klar!

Ich muss so oft Managern was über IT erklären, da hat man mittlerweile so einige Analogien auf Lager.
Spart viel Zeit und Fehlentscheidungen.

 

[K-551]

Aber welches der genaue Fontname ist, ist aus dem Source nicht ersichtlich, oder?

Du kannst ggf. mal die komplette Datei posten

Nein, denn:

Du kannst den Font ncht aus der SVG extrahieren. Da ist einfach kein Font eingebettet. Der Font wurde einfach in eine Vektorgrafik umgewandelt und ist in der svg "verschwunden". Das ist nicht mehr nachvollziehbar.

Es ist zwar theoretisch machbar einen Font in eine SVG einzubetten oder daneben zu legen, hab ich aber in der Realität noch nie gesehen.
Ein Font ist (vereinfacht gesagt) auch nur ne Datei mit Vektorgrafiken. Also wird eine Grafik in die andere geschoben. Ursprung nicht mehr nachvollziehbar.

Die analogie mit der Wurst von @foofoobar ist schon sehr passend.
Es geht auch: das du aus einem Konzertmitschnitt nicht den Hersteller der dritten Geige von links ermitteln kannst... (i.d.R.)

Ergänzung (18. Oktober 2025)

Du meinst damit den Gradient (Farbverlauf), richtig?

Jup

Gib doch mal die Datei her, dann kann man mal gucken. Hab auch ne riesige Font-Sammlung. Vielleicht hab ich auch den richtigen bei...