Logo-Dateien: welche Formate Sie für Website und Druck brauchen
Kurz gesagt: Ein einzelnes JPG reicht für ein Logo selten: Es hat keinen transparenten Hintergrund, wird beim Vergrößern unscharf und eignet sich nicht für den Druck. Ein vollständiges Logopaket enthält eine Vektordatei als Ursprung (für Web als SVG, für den Druck meist als PDF oder EPS), PNG-Dateien mit transparentem Hintergrund, quadratische Versionen für Favicon und Profilbilder sowie Varianten für helle und dunkle Hintergründe. Wer das einmal sauber anlegt, spart sich bei jeder Broschüre, jedem Schild und jedem neuen Online-Profil die Suche.
Der typische Fall: Das Logo wurde vor Jahren entworfen, die Agentur gibt es nicht mehr, und im Postfach findet sich nur „logo.jpg“ mit weißem Kasten drumherum. Auf der Website wirkt es auf farbigem Hintergrund wie ein Aufkleber, und die Druckerei fragt nach „offenen Daten“. Höchste Zeit für ein ordentliches Dateipaket.
Die Bausteine eines vollständigen Logopakets
Baustein 1: Die Vektordatei als Original
Vektorgrafiken bestehen aus Formen und Kurven statt aus Pixeln. Sie lassen sich beliebig vergrößern, ohne unscharf zu werden – vom Favicon bis zur Fahrzeugbeschriftung. Für das Web ist SVG das passende Vektorformat: MDN beschreibt SVG als ideal für Oberflächenelemente, Icons und Diagramme, die in unterschiedlichen Größen exakt dargestellt werden müssen; alle gängigen Browser unterstützen es. Für den Druck verlangen Druckereien meist PDF oder EPS mit eingebetteten Vektoren.
Wenn Sie nur ein JPG haben, gibt es keine Abkürzung: Das Logo muss in einem Grafikprogramm nachgezeichnet werden („vektorisiert“). Automatische Umwandlungsprogramme liefern bei einfachen Logos brauchbare Entwürfe, bei Schrift und feinen Details aber oft unsaubere Kanten.
Achten Sie bei der fertigen Vektordatei auf zwei Details: Schriften sollten in Pfade umgewandelt sein, damit das Logo auch auf Rechnern ohne die verwendete Schrift richtig aussieht, und überflüssige Ebenen oder versteckte Elemente sollten entfernt werden. Gerade SVG-Dateien aus Grafikprogrammen enthalten oft unnötigen Ballast, den man vor dem Einbau in die Website bereinigen kann – das macht die Datei kleiner und vermeidet Darstellungsfehler.
Baustein 2: PNG mit transparentem Hintergrund
Nicht jede Plattform nimmt SVG an – viele Website-Baukästen, Social-Media-Profile, E-Mail-Signaturen und Office-Vorlagen wollen eine Pixeldatei. Hier ist PNG die richtige Wahl. MDN empfiehlt PNG gegenüber JPEG für eine präzise Wiedergabe und wenn Transparenz nötig ist; für Logos, Screenshots und Strichgrafiken rät MDN generell zu verlustfreier Kompression, weil Unschärfe und Farbsäume an Kanten sonst deutlich sichtbar werden. JPG ist für Fotos gemacht, nicht für Logos.
Legen Sie PNGs in mehreren Breiten an, etwa eine kleine für E-Mail-Signaturen und eine große für Präsentationen.
Baustein 3: Quadratische Versionen
Viele Logos sind breit, Favicons und Profilbilder aber quadratisch. Sie brauchen daher eine Bildmarke oder eine kompakte Variante, die im Quadrat funktioniert – oft nur das Symbol oder die Initialen.
- Favicon: Laut Google Search Central muss das Favicon quadratisch (1:1) und mindestens 8 × 8 Pixel groß sein; empfohlen wird eine Größe über 48 × 48 Pixel. Unterstützte Formate laut dieser Seite (abgerufen November 2026): BMP, GIF, ICO, PNG, JPEG, PPM und TIFF – SVG steht dort nicht auf der Liste. Ein zusätzliches PNG-Favicon ist daher sinnvoll, auch wenn Ihre Website ein SVG-Favicon verwendet.
- App-Symbole für die Website: Wer eine Web-App mit Manifest-Datei anbietet, braucht laut web.dev für Chromium-Browser mindestens Symbole in 192 × 192 und 512 × 512 Pixeln.
- Profilbilder für Google-Unternehmensprofil, LinkedIn, Instagram und Co.: ebenfalls quadratisch, mit genug Rand, weil manche Plattformen das Bild rund beschneiden.
Baustein 4: Varianten für helle und dunkle Hintergründe
Ein dunkles Logo verschwindet auf dunklem Foto oder im Dunkelmodus. Ein vollständiges Paket enthält deshalb mindestens:
- die farbige Hauptversion,
- eine einfarbig dunkle Version,
- eine einfarbig helle (meist weiße) Version.
Google weist im Zusammenhang mit dem Organisations-Markup darauf hin, dass ein Logo auf rein weißem Hintergrund so aussehen sollte, wie Sie es beabsichtigen – ein überwiegend weißes oder graues Logo wirkt dort womöglich nicht wie gewünscht. Für das Logo im strukturierten Datenblock der Website nennt Google außerdem eine Mindestgröße von 112 × 112 Pixeln.
Baustein 5: Farbangaben
Für Bildschirm und Druck gelten unterschiedliche Farbsysteme: RGB beziehungsweise Hex-Werte für Website und Apps, CMYK für den klassischen Druck, oft zusätzlich eine Sonderfarbe für Schilder oder Textilien. Notieren Sie die Werte in einem kurzen Farbblatt. Welche Angaben Ihre Druckerei genau braucht, klären Sie am besten direkt mit ihr – die Anforderungen unterscheiden sich je nach Verfahren.
Wofür welche Datei
| Einsatz | Empfohlene Datei | Hinweis |
|---|---|---|
| Website-Kopfzeile | SVG, alternativ PNG | SVG bleibt auf allen Bildschirmen scharf |
| Favicon | ICO oder PNG, quadratisch, zusätzlich SVG möglich | größer als 48 × 48 Pixel laut Google |
| Logo im Organisations-Markup | PNG oder JPG, mindestens 112 × 112 Pixel | muss auf Weiß gut aussehen |
| E-Mail-Signatur | PNG in kleiner Breite | viele Mailprogramme zeigen kein SVG |
| Social-Media-Profil | quadratisches PNG | Bildmarke statt Schriftzug |
| Präsentationen, Office-Dokumente | PNG mit Transparenz | große Breite für Beamer |
| Visitenkarten, Briefpapier, Flyer | PDF oder EPS mit Vektoren | Farbwerte mit Druckerei abstimmen |
| Schilder, Fahrzeuge, Textilien | Vektordatei, Sonderfarbe | Hersteller nach Vorgaben fragen |
Ordnung im Paket
Legen Sie alle Dateien in einem Ordner „Logo“ in Ihrer gemeinsamen Ablage ab, mit sprechenden Namen wie logo-farbig.svg, logo-weiss.png, logo-symbol-quadrat.png. Ein PDF mit den Varianten, Farbwerten und einem Hinweis zum Mindestabstand hilft allen, die später mit dem Logo arbeiten – von der Druckerei bis zum Website-Dienstleister.
Häufige Fragen
Kann ich aus einem JPG einfach ein SVG machen, indem ich die Endung ändere?
Nein. Eine Umbenennung ändert nichts am Inhalt. Ein echtes SVG entsteht nur durch Nachzeichnen oder aus der ursprünglichen Vektordatei.
Wo finde ich die Originaldateien meines Logos?
Fragen Sie bei der Agentur oder Person nach, die es gestaltet hat, und suchen Sie in alten Mails nach Dateien mit den Endungen .ai, .eps, .pdf oder .svg. Auch Druckereien haben die Daten oft noch archiviert.
Reicht ein PNG für die Website, oder brauche ich SVG?
Ein ausreichend großes PNG funktioniert. SVG ist schärfer und meist kleiner, aber nicht jedes Content-Management-System lässt SVG-Uploads standardmäßig zu.
Brauche ich für den Dunkelmodus eine eigene Logo-Datei?
Wenn Ihr Logo dunkle Elemente hat und Ihre Website oder App einen Dunkelmodus anbietet, ja – eine helle Variante, die die Website automatisch einsetzt.
Wenn Sie Ihr Logo für den nächsten Website-Relaunch oder eine App fit machen wollen und nicht wissen, welche Dateien fehlen, gehen wir das Paket gern gemeinsam durch – hier geht es zur Anfrage.