logo designMay 26, 202610 min read

Logo-Dateiformate erklärt: SVG, PNG, PDF, AI, EPS

SVG fürs Web. PNG für Präsentationen. PDF für den Druck. AI und EPS zum Bearbeiten. Der vollständige Leitfaden, welches Logo-Dateiformat wann und genau warum verwendet werden sollte.

By Boone
XLinkedIn
logo file formats explained

Logo-Dateiformate erklärt: SVG, PNG, PDF, AI, EPS

Das Einzige, das du über Logo-Dateiformate wissen musst

Ein Logo ist keine Datei. Es ist ein System aus Dateien. Einen einzelnen PNG zu verschicken und das als Übergabe zu bezeichnen, ist der schnellste Weg, vor zahlenden Kunden unprofessionell auszusehen.

Die fünf Formate, die wirklich zählen, sind SVG, PNG, PDF, AI und EPS. Jedes hat seine Aufgabe. Das falsche Format für den falschen Zweck einzusetzen bedeutet: Das Logo verpixelt auf einem Plakat, öffnet sich nicht auf der Maschine des Dienstleisters oder kommt aus dem Stickerei-Shop zurück, als wäre es auf einem Klapphandy entworfen worden.

Voxel-Illustration von fünf Logo-Dateiformat-Containern, arrangiert als vollständiges Übergabesystem.
Voxel-Illustration von fünf Logo-Dateiformat-Containern, arrangiert als vollständiges Übergabesystem.

Vektor vs. Raster, in einem Absatz

TypFormateVerhalten
VektorSVG, AI, EPS, PDFSpeichert Formen als mathematische Beschreibungen. Bei jeder Größe wird die Mathematik neu berechnet; Kanten bleiben scharf.
RasterPNG, JPGSpeichert ein festes Pixelraster. Vergrößere über 100% und das Raster wird sichtbar.

Das ist der gesamte Unterschied. Ein Logo muss immer zuerst als Vektordatei vorliegen, aus der dann Raster-Exporte erzeugt werden.

Voxel-Diagramm, das eine Vektorform mit scharfen Kanten einem Raster-Pixelraster bei Vergrößerung gegenüberstellt.
Voxel-Diagramm, das eine Vektorform mit scharfen Kanten einem Raster-Pixelraster bei Vergrößerung gegenüberstellt.

SVG, das web-native Vektorformat

SVG steht für Scalable Vector Graphics. Es ist ein XML-basiertes Format, das Browser nativ lesen, was bedeutet: kein Rendering-Overhead, kein unscharfes Retina-Display, keine separate 2x-Datei zum Pflegen. Bette es in ein <img>-Tag ein oder füge es direkt in HTML ein, und es skaliert auf jede Auflösung ohne ein einziges zusätzliches Byte.

ElevenLabs-Homepage-Logo als SVG gerendert für eine gestochen scharfe Darstellung bei jeder Bildschirmauflösung.
ElevenLabs-Homepage-Logo als SVG gerendert für eine gestochen scharfe Darstellung bei jeder Bildschirmauflösung.

Live ansehen auf elevenlabs.io

SVG ist richtig für:

  • Website-Header
  • App-Icons
  • E-Mail-Signaturen (auf Plattformen, die es unterstützen)
  • Jede digitale Oberfläche, die du kontrollierst

Die meisten Design-Tools exportieren es direkt.

Wo SVG scheitert:

  • Microsoft Office: Word und PowerPoint haben je nach Version und Betriebssystem inkonsistente SVG-Unterstützung
  • Ältere Druck-Workflows: Manche Produktionswerkzeuge kommen mit SVG nicht zurecht; verwende stattdessen PDF oder EPS

PNG, der sichere Fallback, der Druckerzeugnisse ruiniert

PNG ist Raster. Es speichert Pixel. Jede Anwendung auf der Welt öffnet ein PNG, was sein einziger Wettbewerbsvorteil ist, und für digitale Anwendungsfälle ein echter.

KontextPNG-Urteil
Web, unterhalb der ursprünglichen ExportgrößeIn Ordnung
Präsentationen, Social-Media-Posts, interne DokumenteIn Ordnung
DruckNiemals. PNG kann nicht ohne Qualitätsverlust vergrößert werden, und die Druckerei wird dir das in einer E-Mail zum ungünstigsten Zeitpunkt mitteilen.

Ein Logo mit 300 DPI auf einer Visitenkarte muss aus einer Vektorquelle stammen.

Exportiere PNG immer in hoher Auflösung, mindestens 2000px auf der längsten Seite, in zwei Versionen: weißer Hintergrund und transparent.

Voxel-Konzept, das zeigt, wie ein Raster-Logo verpixelt, wenn es über seine ursprünglichen Exportmaße hinaus skaliert wird.
Voxel-Konzept, das zeigt, wie ein Raster-Logo verpixelt, wenn es über seine ursprünglichen Exportmaße hinaus skaliert wird.

PDF, das Format, das überall ankommt ohne zu zerbrechen

PDF bettet Vektordaten ein. Exportiere es aus Illustrator oder Figma und es öffnet sich auf jedem Gerät, vollständig skalierbar, ohne spezielle Software.

Moo-Druckservice-Upload-Interface mit Vektorformat-Anforderungen für die Visitenkarten-Produktion.
Moo-Druckservice-Upload-Interface mit Vektorformat-Anforderungen für die Visitenkarten-Produktion.

Druckspezifikationen auf moo.com ansehen

Keine Schriftprobleme. Keine fehlenden Assets. Keine "Ich habe Illustrator nicht"-Antworten von Dienstleistern.

Für Druckarbeiten ist PDF das praktischste Vektor-Lieferformat:

  • Gewerbliche Drucker nehmen es direkt in ihren Workflow auf
  • Beschilderungsanbieter platzieren es in Wide-Format-Layoutsoftware
  • Stickerei-Shops konvertieren es, ohne Linienpräzision zu verlieren
  • Dienstleister ohne Illustrator können es trotzdem öffnen

Es ist das Format, das man schickt, wenn man nicht weiß, welche Anwendung der Empfänger verwendet, was die meisten externen Übergaben abdeckt.

PDF ist auch das Format für Lockup-Varianten (Logo plus Tagline, gestapelt, horizontal). Der Dienstleister platziert es direkt in InDesign oder Acrobat ohne Konvertierungsschritt.

AI, die Arbeitsdatei, die dein Designer behält

AI ist Adobe Illustrators native Arbeitsdatei, nicht das Endprodukt. Sie speichert alles:

  • Ebenen und Objekte
  • Farbmuster
  • Hilfslinien und Zeichenflächen
  • Live-Text mit intakten Originalschriften
  • Erscheinungsattribute
  • Sonderfarben

Dein Designer behält die AI-Datei. Du bekommst Exporte davon. Wenn die Zusammenarbeit endet und du das Logo später bearbeiten musst, ist diese AI-Datei das, was die Bearbeitung möglich macht.

Verträge sollten verlangen, dass der Designer sie bei Projektabschluss übergibt. Wenn deiner das nicht getan hat, ist das eine Lücke, die es wert ist, sie zu schließen, bevor Änderungen nötig werden.

AI-Dateien öffnen sich vollständig nur in Illustrator (und teilweise in Affinity Designer). Für Kunden, die ein Logo in eine Präsentation einfügen möchten, PNG schicken. Für einen Dienstleister, der explizit AI anfordert, dieses schicken und die Illustrator-Version bestätigen, da die versionsübergreifende Kompatibilität unzuverlässig ist.

EPS, das Legacy-Format, das dein Drucker noch immer verlangt

EPS (Encapsulated PostScript) ist älter als PDF. Es war das Standard-Vektortauschformat, bevor PDF dominant wurde, und Druckdienstleister, die seit Jahrzehnten im Geschäft sind, fragen noch immer aus Gewohnheit danach.

GitLab-Pressekit-Seite mit EPS und Vektor-Logo-Downloads für Produktions- und Medieneinsatz.
GitLab-Pressekit-Seite mit EPS und Vektor-Logo-Downloads für Produktions- und Medieneinsatz.

Pressekit auf about.gitlab.com ansehen

EPS und AI tragen dieselben Vektordaten. Der wesentliche Unterschied: EPS ist in älterer Produktionssoftware universeller lesbar, während AI Illustrator-spezifische Funktionen wie Live-Text und Transparenz beibehält, die EPS beim Export abflacht.

Wenn ein Dienstleister EPS verlangt, gib ihm EPS. Wenn niemand danach fragt, erledigt PDF dieselbe Aufgabe mit besserer Kompatibilität für moderne Werkzeuge.

Die Favicon- und Social-Avatar-Falle

Ein Favicon ist kein verkleinertes Logo. Es ist eine eigenständige Designarbeit. Bei 32x32 Pixeln verschwinden die meisten Logo-Details. Ein Wordmark mit Tagline wird zu einem grauen Fleck, und was bei 300px klar lesbar ist, wird bei 32px unleserlich.

Der Favicon-Prozess in drei Schritten:

  1. Entwirf ein dediziertes Favicon-Zeichen, in der Regel den ersten Buchstaben, ein Monogramm oder das prägnanteste Logomark-Element, von dem sekundäre Details entfernt wurden.
  2. Exportiere die Datei, entweder .ico (ein Container für PNG bei 16x16, 32x32 und 48x48) oder ein 192x192 PNG, das der Browser skaliert.
  3. Behandle Social-Avatare separat. Instagram beschneidet auf einen Kreis bei etwa 110x110px, also sollte das Profilbild nur das Logomark sein, niemals das vollständige Lockup mit Wordmark.

Das Kunden-Übergabepaket, das Brainy mit jedem Logo mitliefert

Jede Brainy-Logo-Übergabe wird als strukturierter Ordner geliefert, nicht als ein Zip mit zufälligen Exporten. Hier ist die genaue Struktur:

YourBrand_Logo_Kit/ ├── 01_Web/ │ ├── logo-primary.svg │ ├── logo-primary@2x.png (2000px, transparent bg) │ ├── logo-reversed.svg │ ├── logo-reversed@2x.png │ ├── icon-only.svg │ └── favicon/ │ ├── favicon.ico │ ├── favicon-192.png │ └── favicon-512.png ├── 02_Print/ │ ├── logo-primary-CMYK.pdf │ ├── logo-primary-CMYK.eps │ ├── logo-reversed-CMYK.pdf │ └── logo-reversed-CMYK.eps ├── 03_Source/ │ └── logo-master.ai └── README.txt

Jeder Ordner hat einen Zweck. Das README enthält einen Absatz mit Hinweisen, welchen Ordner man für welche Aufgabe öffnen soll.

Kein Kunde sollte raten müssen. Ein Logo-Kit ohne README ist ein Kit, das für Designer entwickelt wurde, nicht für Kunden.

GitHub-Markenkit-Seite mit strukturierten Logo-Downloads inklusive SVG, PNG und Vektor-Quelldateien.
GitHub-Markenkit-Seite mit strukturierten Logo-Downloads inklusive SVG, PNG und Vektor-Quelldateien.

Markenkit auf brand.github.com ansehen

Lass Brainy dein Logo gestalten und du bekommst das vollständige Kit, beschriftet und strukturiert, beim ersten Mal.

Die Format-Entscheidungstabelle auf einen Blick

Die folgende Tabelle ordnet jeden gängigen Anwendungsfall dem richtigen Format zu. Drucke sie aus, mache einen Screenshot, füge sie in dein Studio-Notion ein, was auch immer sie griffbereit hält, wenn ein Kunde fragt: "Welche Datei schicke ich an den Drucker?"

AnwendungsfallRichtiges FormatWarum
Website-HeaderSVGSkaliert auf jede Auflösung; native Browser-Unterstützung
Website-FallbackPNG (2x)Universelle Kompatibilität, wenn SVG nicht verfügbar ist
E-Mail-SignaturPNGSVG wird von den meisten E-Mail-Clients blockiert oder entfernt
Druck (Visitenkarte, Briefpapier)PDF oder EPSVektor; von jedem gewerblichen Drucker akzeptiert
Großformatige BeschilderungPDF oder EPSSkaliert auf jede Größe ohne Qualitätsverlust
Stickerei oder VinylschnittEPS oder AIErforderliche Eingabe für die meiste Produktionssoftware
Präsentationen (Google, PowerPoint)PNGSVG-Unterstützung variiert je nach Version; PNG ist zuverlässig
Social-Media-AvatarPNG (quadratisch, nur Logomark)Plattformen komprimieren oder lehnen SVG ab
Favicon.ico oder PNG (192x192)Browser-Spezifikation; SVG nicht universell unterstützt
Video-WasserzeichenPNG (transparent)PNG-Alphakanal funktioniert in Video-Editoren
Logo-Bearbeitung oder RedesignAIVollständige Arbeitsdatei mit allen Ebenen und Attributen
Dienstleister-Übergabe (unbekannte Tools)PDFÖffnet überall; bewahrt Vektordaten
Voxel-Entscheidungsbaum, der Logo-Formatentscheidungen für Web, Druck, Bearbeitung und Fallback-Anwendungsfälle abbildet.
Voxel-Entscheidungsbaum, der Logo-Formatentscheidungen für Web, Druck, Bearbeitung und Fallback-Anwendungsfälle abbildet.

FAQ

Was ist der Unterschied zwischen AI und EPS?

Beide sind Vektorformate. AI ist Illustrators natives Arbeitsformat und bewahrt Live-Text, Transparenz, Zeichenflächen und Erscheinungsattribute. EPS ist älter und breiter lesbar, flacht diese Funktionen aber beim Export ab. Behalte AI als Quelle der Wahrheit und schicke EPS, wenn ein Dienstleister danach fragt.

Kann ich einfach PNG für alles verwenden?

Nein. PNG verschlechtert sich, wenn es gedruckt oder über seine Exportgröße hinaus skaliert wird. Dienstleister werden es ablehnen, Stickmaschinen können es nicht verwenden. Die obige Tabelle zeigt, was stattdessen zu schicken ist.

Was ist mit WebP, GIF, TIFF oder BMP?

Keines davon ist ein Logo-Format. WebP ist für Fotokomprimierung, GIFs 256-Farben-Palette ruiniert saubere Kanten, TIFF ist für die Archivierung, und BMP hat keine Transparenz. Die fünf oben genannten Formate decken jeden legitimen Logo-Anwendungsfall ab.

Mein Designer hat mir nur ein PNG geschickt. Was soll ich tun?

Fordere das vollständige Kit an: SVG, PDF, EPS und die AI-Quelle. Arbeitsdateien gehören dem Kunden, sofern dein Vertrag nichts anderes besagt. Wenn der Designer nicht reagiert, lass Brainy dein Logo neu gestalten und bekomme diesmal alle Dateien korrekt.

Sollten Logos RGB oder CMYK sein?

RGB für Bildschirme, CMYK für den Druck. Die Farbverschiebung zwischen Profilen ist real, also prüfe alles, was zu einem physischen Drucker geht. PDF und EPS für den Druck sollten CMYK sein, sofern der Dienstleister nichts anderes angibt.

Funktioniert SVG für E-Mail-Signaturen?

Meistens nicht. Gmail, Outlook und Apple Mail behandeln SVG inkonsistent, und manche Clients entfernen es vollständig. Verwende ein PNG für E-Mail-Signaturen. 200px breit bei 2x-Auflösung ist ein zuverlässiger Ausgangspunkt.

Welches Format braucht ein Stickerei-Shop?

Die Maschine verwendet ein Stickformat (DST, PES), das ein Digitizer aus deiner Grafik erstellt. Gib dem Shop dein Vektorlogo als EPS oder AI, damit sie es präzise nachzeichnen und konvertieren können. Schicke niemals ein PNG an einen Stickerei-Dienstleister.

Das richtige Format beim ersten Mal schicken

SVG auf der Website. PNG als Fallback. PDF für den Drucker.

AI für zukünftige Bearbeitungen. EPS, wenn ein Legacy-Dienstleister es verlangt. Favicon als eigenständiges Zeichen gestaltet, nicht verkleinert. Das vollständige Kit, beschriftet und strukturiert, einmal geliefert und für immer referenziert.

Die Marken, die an jedem Touchpoint poliert wirken, verwenden keine besseren Logos. Sie verwenden die richtigen Dateien für jede Oberfläche.

Für weitere praxisnahe Markenratgeber durchstöbere die vollständige Brainy Papers Bibliothek. Benötigst du ein Logo-System, das beim ersten Mal richtig aufgebaut und geliefert wird? Lass Brainy dein Logo gestalten.

Need a logo that ships with the right files for every use case, not a single PNG you have to email back for? Brainy designs and delivers full logo systems.

Get Started

More from Brainy Papers

Keep reading