Pixel-Art-Generator

Einrichten
Pixel-Editor wird geladen…

Zeichne Pixel-Art von Hand auf einem leeren logischen Raster – ganz ohne Prompt, Fotoumwandlung oder Upload. Wähle eine Leinwand bis 64×64, arbeite mit Stift, Radierer und begrenzter Füllung, nimm Farben auf, spiegele Striche, mache Änderungen rückgängig und exportiere ein transparentes Sprite. Der Editor läuft in deinem Browser und speichert das Projekt im aktuellen Tab.

So zeichnest du Pixel-Art von Grund auf

  1. 1

    Logisches Raster wählen

    Gib dem Projekt einen Namen und stelle Breite und Höhe auf 4 bis 64 Pixel ein. Vorgaben ermöglichen schnelle quadratische Leinwände.

  2. 2

    Zeichnen und verfeinern

    Nutze Stift, Radierer, Füllwerkzeug oder Pipette mit deiner Arbeitspalette. Spiegele die Zeichnung horizontal oder vertikal und mache ganze Striche rückgängig.

  3. 3

    Sprite prüfen

    Kontrolliere vor dem Export die logischen Abmessungen, die Anzahl gefärbter Pixel und die Zahl der verwendeten Farben.

  4. 4

    Scharfe Datei exportieren

    Lade ein transparentes PNG mit ganzzahliger Skalierung, ein kompaktes SVG oder validiertes Projekt-JSON zur späteren Bearbeitung herunter.

Ein Pixel-Art-Editor für bewusstes Zeichnen im Raster

Pixel-Art entsteht Zelle für Zelle. Dieser Editor beginnt mit einem leeren transparenten Raster und speichert für jedes logische Pixel eine Farbe – oder Transparenz. Er verwandelt kein Foto in gemittelte Farbblöcke; nutze für diesen separaten Ablauf den Bild-Pixelator. Auch aus einem KI-Prompt wird kein Bild erzeugt.

Ein kleines Raster zwingt zu einer klareren Silhouette, während ein größeres Raster Platz für Schattierungen und Details lässt. Diese Größen sind praktische Ausgangspunkte und keine Vorgaben einer Plattform:

Logische Leinwand Geeigneter Ausgangspunkt
8×8 Winzige Symbole, Glyphenübungen und einfache Kacheln
16×16 Oberflächensymbole, Inventargegenstände und kompakte Sprites
32×32 Figuren, Kreaturen und Spielgegenstände
64×64 Detailreiche Sprites, Porträts und größere Einzelgrafiken

Vergrößerte Pixel scharf halten

Der PNG-Export verwendet einen ganzzahligen Skalierungsfaktor und deaktiviert die Bildglättung. Ein einzelnes Quellpixel eines 16×16-Bildes wird dadurch exakt zu einem 4×4-, 8×8- oder größeren Quadrat statt zu einer unscharfen Kante. Schachbrettmuster und optionales Editorraster dienen nur als Hilfen und sind nie Teil der Datei. Transparente Zellen bleiben transparent.

Der SVG-Export nutzt scharfkantige Rechtecke und lässt transparente Zellen weg. Das Projekt-JSON bewahrt das bearbeitbare logische Raster und die Arbeitspalette. Es ist ein Hyperion-Projektformat und kein Ersatz für Ebenenformate aus Desktop-Programmen für Pixel-Art.

Zeichenwerkzeuge und Spiegelung

  • Stift färbt Zellen und verbindet schnelle Zeigerpositionen, damit keine Lücken im Strich entstehen.
  • Radierer setzt Zellen wieder auf transparent.
  • Füllwerkzeug ändert einen über vier Seiten verbundenen Bereich; nur diagonal aneinandergrenzende Bereiche bleiben getrennt.
  • Pipette übernimmt die Farbe einer vorhandenen Zelle. Wird Transparenz aufgenommen, wechselt das Werkzeug zum Radierer.
  • Spiegelzeichnung spiegelt die Aktion von links nach rechts, von oben nach unten oder in beide Richtungen. Mittlere Reihen und Spalten werden nur einmal angewendet.

Maus, Stift, Touchscreen und Tastatur greifen auf dasselbe logische Raster zu. Fokussiere die Leinwand, verschiebe die aktive Zelle mit den Pfeiltasten und wende das gewählte Werkzeug mit Leertaste oder Eingabetaste an. P, E, F und I wählen Werkzeuge; Entf radiert; Strg/Cmd+Z macht rückgängig.

Browserverhalten und technische Quellen

Der Editor nutzt die Canvas-API, Pointer Events und die Steuerung der Bildglättung. Die PNG-Erstellung folgt der Canvas-Blob-Export-API. Tastatur- und Zeigerinteraktionen orientieren sich an den Bedienbarkeitsrichtlinien der WCAG 2.2.

Grafik, Name und Palette bleiben im lokalen Projektstatus des Browsers und werden weder URLs noch Server-Nutzdaten hinzugefügt. Beim Wechsel eines Assistentenschritts finden weiterhin normale Seitenanfragen statt. Ist der Tab-Speicher nicht verfügbar, funktioniert der vollständige Einseiten-Editor im Arbeitsspeicher weiter; der Assistent navigiert jedoch nicht weiter, damit das Projekt nicht unbemerkt verloren geht.

Häufig gestellte Fragen

Nein. Es ist ein manueller Pixel-Art-Editor mit leerem Raster. Du wählst jede Farbe und zeichnest jede Zelle mit Stift, Radierer, Füllwerkzeug, Pipette und optionaler Spiegelung selbst. Das Werkzeug nimmt keine Prompts an und ruft keinen generativen Dienst auf.

Dieses Werkzeug erstellt neue Grafiken auf einem leeren Raster. Ein Bild-Pixelator beginnt mit einem hochgeladenen Foto oder einer Illustration und reduziert sie auf größere Blöcke gemittelter Farben. Die beiden Abläufe dienen unterschiedlichen Zwecken.

Probiere 16×16 für ein kleines Symbol oder 32×32 für eine Figur oder einen Gegenstand. Beginne kleiner, wenn du Silhouetten üben möchtest, und nutze 64×64 nur für Entwürfe mit mehr Details. Breite und Höhe lassen sich unabhängig auf 4 bis 64 Pixel einstellen.

Ja. Leere und radierte Zellen haben im PNG einen Alphawert von null. Das Schachbrettmuster zeigt im Editor nur die Transparenz an und wird nicht exportiert.

Beim Export wird jedes logische Pixel mit einem exakten ganzzahligen Faktor und ohne Bildglättung vergrößert. Zwischen benachbarten Zellen werden keine Zwischenfarben berechnet.

Nein. Version 1 bearbeitet ein einzelnes Standbild. Exportiere einzelne Grafiken hier und nutze anschließend den Sprite-Sheet-Generator, um fertige Frames in einem Atlas zusammenzufassen.

Die Leinwand unterstützt Maus, Stift und die Eingabe mit einem Finger. Sie lässt sich auch per Tastatur bedienen: Pfeiltasten verschieben die aktive Zelle, Leertaste oder Eingabetaste wendet das Werkzeug an und Buchstabentasten wählen Werkzeuge.

Der Editor lädt weder die Grafik noch den Projektnamen, die Palette oder exportierte Dateien hoch. Der Projektstatus bleibt im Browser-Tab. Beim Öffnen der Seite und beim Wechsel zwischen Assistentenschritten finden weiterhin gewöhnliche Webanfragen statt.

Verwandte Tools

Tool in anderen Sprachen verfügbar