SparkIconAISparkIconAI
Was ist ein App-Icon? Definition, Größen und Funktionsweise

Was ist ein App-Icon? Definition, Größen und Funktionsweise

Philexon in an hour

Was ist ein App-Icon?

Ein App-Icon ist das kleine quadratische Bild, das eine Anwendung auf einem Smartphone, einem Tablet oder einem Computer vertritt. Es ist das Bild, das du antippst, um die App zu öffnen, das Vorschaubild, an dem du im Store vorbeiscrollst, und das Zeichen, das neben dem App-Namen im Teilen-Dialog steht. Eine Datei, oder öfter ein ganzer Satz von Dateien, arbeitet gleichzeitig als Button, als Label und als Markenzeichen.

Der Begriff überschneidet sich mit einigen Nachbarn, und die Grenzen verschwimmen schnell. Ein Logo ist das Zeichen eines Unternehmens und kann jede Form haben. Diese quadratische Darstellung auf dem Gerät ist die, die Menschen antippen. Ein Favicon ist das Gegenstück einer Website im Browser-Tab. Und ein Benachrichtigungssymbol ist die winzige Glyphe, die eine App im Betrieb in der Statusleiste zeigt. Fragt man, was ein App-Icon ist, meinen die meisten dieses quadratische Launcher-Bild, und genau davon handelt dieser Guide.

App-Icon vs. Logo vs. Favicon

Die drei werden oft verwechselt, weil sie absichtlich ähnlich aussehen. Die Unterschiede liegen in Form, Größe und darin, wo jedes zu finden ist:

App-IconLogoFavicon
FormQuadrat, Ecken vom Betriebssystem abgerundetBeliebige FormQuadrat, klein dargestellt und in Tabs oft rund
Zu finden inHomescreen, App-Store, EinstellungenWebsite-Header, Visitenkarte, VerpackungBrowser-Tab, Lesezeichenliste, Verlauf
Typische Größen1024 px Master, heruntergerechnet auf 48 px oder kleinerVektor, beliebige Größe16 px, 32 px, 48 px, 180 px apple-touch-icon
Wer gestaltet esDu gestaltest das Quadrat, das System rundet und skaliert esDu oder dein DesignerDu lieferst es mit der Website aus

Um es direkt zu definieren: Ein Favicon ist die kleine Bilddatei, die eine Website veröffentlicht, damit Browser ihr Zeichen in Tabs und Lesezeichenlisten zeigen können. Falls du es auch fürs Web brauchst, erklärt der MDN-Guide zu Favicons die Mechanik, und der Site-Icon-Generator von SparkIconAI schneidet einen Master in einem Durchgang in jede Favicon- und PWA-Größe.

Welche Größe hat ein iOS-App-Icon?

Auf der Apple-Seite lieferst du einen quadratischen Master mit 1024 x 1024 px, als PNG und ohne Transparenz. Seit Xcode 14 ist dieser eine Master alles, was der Asset-Katalog braucht: iOS leitet daraus jeden anderen Kontext ab, den Homescreen, Spotlight, die Einstellungen und Benachrichtigungen. Apples Leitfaden zu App-Icons verlangt ein vollflächiges Quadrat, weil das System und nicht der Designer die abgerundeten Ecken setzt, und mit iOS 26 kann das System seine Liquid-Glass-Behandlung auch auf Homescreen-Icons anwenden. In der Praxis heißt das: Abgerundete Ecken backst du nie in die Datei ein, die du einreichst.

Welche Größe hat ein Android-App-Icon?

Android verlangt zwei Dinge. Das Icon für den Google-Play-Eintrag ist ein 512 x 512 px 32-bit PNG. Das Launcher-Icon ist ein Adaptive Icon: zwei Ebenen, Hintergrund und Vordergrund, jeweils 108 dp, wovon die mittleren 72 dp die Maske überstehen und ein zentrierter Kreis von 66 dp die garantierte Sicherheitszone ist. Verschiedene Launcher maskieren diese Form unterschiedlich, manche rund, manche als Squircle, deshalb lautet die Regel: Halte den wichtigen Teil deines Zeichens innerhalb des Sicherheitskreises. Die Adaptive-Icon-Dokumentation enthält die vollständige Spezifikation, und der Google-Play-Icon-Generator exportiert aus einem Master sowohl das 512-px-Asset für den Eintrag als auch das mipmap-Set.

Was ist ein App-Icon-Badge auf Android?

Ein App-Icon-Badge ist der kleine Punkt oder die Zahl, die in der Ecke des Icons erscheint, wenn die App eine offene Benachrichtigung hat. Google nennt die Punkt-Form notification dots, ein Feature seit Android 8.0. Samsungs One UI nennt dasselbe app icon badges und lässt dich pro App zwischen Punkt und Zahl wählen, deshalb liest sich der Begriff auf einem Samsung-Telefon anders als auf einem Pixel. Tippe lange auf das Icon, um einen Blick auf die Benachrichtigungen zu werfen, oder schalte die Funktion in den Einstellungen unter Benachrichtigungen um. Das Badge zeichnet das System, du musst also nichts in die Datei selbst einbauen, doch es ist ein Grund mehr, die Mitte deines Zeichens frei zu halten.

Was ist das Apps-Icon auf Android?

Auf vielen Android-Telefonen ist das Apps-Icon der Button unten auf dem Homescreen, meist ein Kreis oder ein Punkte-Raster, der den App-Drawer öffnet: die vollständige alphabetische Liste aller installierten Apps. Es ist ein Navigationselement und nicht das Icon einer Anwendung, und genau in dieser Verwechslung steckt die Frage meist. Sein Aussehen ändert sich mit dem Launcher, und bei der Gestensteuerung verschwindet es komplett, ersetzt durch ein Wischen nach oben.

Da wir gerade unbekannte Zeichen entschlüsseln: Ein einzelnes Buchstaben-Symbol in der Statusleiste, etwa ein T-Icon auf Android, kommt fast nie vom System selbst. Android liefert kein eingebautes T-Symbol mit, es stammt also von einer Drittanbieter-App, die eine Benachrichtigung gepostet hat, oft von einer App, deren Name mit diesem Buchstaben beginnt. Ein Blick in den Benachrichtigungsverlauf in den Einstellungen nennt dir die App in wenigen Sekunden.

Wie Icons entstehen

Es gibt zwei Wege zum quadratischen Master. Der klassische Weg: Ein Designer zeichnet das Icon in Vektor-Software am Raster und feilt an der Silhouette, bis sie bei 48 px noch lesbar ist. Der neuere Weg ist generativ: Du beschreibst das Zeichen in einem Satz, ein KI-Modell liefert einen 1024-px-Master zurück, und du verfeinerst das Ergebnis durch neue Prompts oder Verzweigungen. Der zweite Weg ist das, was SparkIconAI tut: Icon beschreiben, Kandidaten generieren, bei 16 px prüfen, dann die Store- und Web-Größen aus einem Master exportieren. Wenn du den ganzen Designprozess willst, führt der Icon-Design-Guide und Generator durch die Entscheidungen zu Konzept, Schrift und Silhouette, und der KI-Icon-Generator ist der schnellste Weg zu deinem ersten Icon.

Kurze FAQ

  • Was ist ein Favicon-Generator? Ein Werkzeug, das einen quadratischen Master in die Favicon-Dateien verwandelt, die eine Seite braucht: favicon.ico, das 180-px-apple-touch-icon und die 192- und 512-px-PWA-Icons. Der Site-Icon-Generator macht genau diesen Schnitt.
  • Was ist Icon-Design? Die Praxis, Symbole zu zeichnen, die Objekte und Ideen darstellen, von den Zeichen auf deinem Homescreen über Interface-Icons bis zu Markensets. Die Icon-Design-Seite behandelt Typen, Regeln und den KI-Workflow.
  • Kann ein Bild alle Größen abdecken? Ja, wenn die Silhouette einfach genug ist. Gestalte den 1024-px-Master, schau ihn dir bei 48, 32 und 16 px an und vereinfache die Form statt der Idee, wenn er unscharf wird.
  • Brauche ich abgerundete Ecken in der Datei? Nein. iOS und Android wenden beide ihre eigene Maskierung an, also reiche ein vollflächiges Quadrat ein und lass das System abrunden.