ASCII-Kunst-Generator

ASCII-Kunst verwandelt ein Bild in reinen Text: Die Helligkeit jeder Region wird zu einem Zeichen, sodass aus einem Foto etwas wird, das Sie in ein Terminal, eine README-Datei oder einen Quellcode-Kommentar einfügen können. Dieser Generator konvertiert JPG-, PNG-, GIF- und WebP-Dateien vollständig im Browser. Nichts wird hochgeladen, und die Umwandlung läuft sofort neu, sobald Sie eine Einstellung ändern.

So funktioniert die Umwandlung

Das Bild wird zunächst auf ein Canvas gezeichnet und, falls es breiter als 800 Pixel ist, proportional verkleinert. Anschließend teilt der Generator das Canvas in ein Raster. Bei cols Spalten ist jede Zelle imageWidth / cols breit, und jede Zelle ist doppelt so hoch wie breit, um die Form dicktengleicher Zeichen auszugleichen. Die Zeilenzahl ist floor(imageHeight / cellHeight).

Für jede Zelle wird genau ein Pixel gelesen und mit der Luma-Formel nach Rec. 601 auf einen einzigen Helligkeitswert reduziert: brightness = 0.299 × R + 0.587 × G + 0.114 × B. Dieser Wert von 0 bis 255 wird auf die gewählte Zeichenrampe abgebildet, mit index = round(brightness / 255 × (charsetLength − 1)); das Zeichen an diesem Index wird angehängt. Ist das Invertieren-Kästchen aktiviert, wird die Helligkeit zuvor durch 255 − brightness ersetzt.

Eine getrennte Umwandlung in Graustufen würde nichts ändern, denn die Luma-Gewichte fassen die drei Kanäle bereits zu einer Zahl zusammen. Die Gewichte selbst sind jedoch bedeutsam: Blau trägt wenig bei (0.114), Grün am meisten (0.587). Ein gesättigtes Blau und ein gesättigtes Gelb können daher verschiedenen Zeichen zugeordnet werden, obwohl ein naiver RGB-Mittelwert sie als gleich hell einstufen würde. Deshalb bleiben grüne Bereiche eines Farblogos meist unterscheidbar, während Rot- und Blauflächen manchmal ineinander verlaufen.

Zeichensatz wählen

Zeichensatz	Rampe	Länge	Am besten für
Standard	@%#*+=-:.	10	Kleine Ausgaben, Logos, klare Strichzeichnungen
Detailliert	$@B%8&WM#… .	etwa 70	Fotos und weiche Verläufe
Blocks	█▇▆▅▄▃▂▁	9	Eine satte, plakative Textur

Jede Rampe läuft von dunkel nach hell, Index 0 ist also das dichteste Zeichen und der letzte Index das hellste. Eine längere Rampe bedeutet kleinere Helligkeitssprünge zwischen benachbarten Zeichen; deshalb verkraftet Detailliert sanfte Schattierungen besser als Standard.

Schritt für Schritt

1. Ziehen Sie ein Bild auf die Upload-Fläche oder klicken Sie darauf, um zu suchen. JPG, PNG, GIF und WebP werden akzeptiert.
2. Stellen Sie die Spaltenzahl mit dem Schieberegler ein, von 40 bis 200. Vorgabe ist 80.
3. Wählen Sie Standard, Detailliert oder Blocks.
4. Aktivieren Sie Invertieren, wenn dunkle Bereiche zu hellen Zeichen werden sollen.
5. Kopieren Sie das Ergebnis über die Schaltfläche und fügen Sie es an einer Stelle mit dicktengleicher Schrift ein.

Praxisbeispiel: Ein Pixel nach dem anderen

Angenommen, das abgetastete Pixel einer Zelle ist ein mittleres Grau mit R = 128, G = 128, B = 128. Der Luma-Wert ist 0.299×128 + 0.587×128 + 0.114×128 = 128. Mit der Standard-Rampe aus 10 Zeichen ist der Index round(128 / 255 × 9) = round(4.52) = 5, also das Zeichen =. Eine schwarze Zelle (Helligkeit 0) wird zu Index 0, @, und eine weiße Zelle (255) zu Index 9, einem Leerzeichen. Mit der Blocks-Rampe ergibt dasselbe mittlere Grau den Index round(128 / 255 × 8) = 4, das Zeichen ▄.

Bei einem Bild von 400×400 Pixeln und 80 Spalten ist jede Zelle 5 px breit und 10 px hoch, die Zeilen ergeben also floor(400 / 10) = 40. Die Ausgabe ist ein 80 Zeichen breiter Block mit 40 Zeilen.

Breite und Invertieren abstimmen

Mehr Spalten bedeuten mehr Detail und einen größeren Textblock; weniger Spalten ergeben ein kräftigeres, abstrakteres Bild, das in schmale Layouts passt. Da das Werkzeug ein Pixel pro Zelle abtastet, zeigen sehr hohe Spaltenzahlen bei einem kleinen Bild eher Aliasing als neue Details. Invertieren ist nützlich, wenn die Kunst auf einem hellen Hintergrund steht, und es ist die schnelle Lösung, wenn ein helles Motiv auf dunklem Grund zu einem fast leeren Rechteck wird.

Zwei Faustregeln helfen: Beginnen Sie mit 80 Spalten, um die Komposition zu beurteilen, gehen Sie auf 40–60 für ein Banner oder einen Inline-Kommentar herunter und erhöhen Sie erst auf 120–160, wenn die Quelle eine saubere, kontrastreiche Grafik ist. Zweimaliges Invertieren stellt die ursprüngliche Zuordnung wieder her, das Umschalten zum Vergleichen ist also unbedenklich. Meldet die Kopierschaltfläche Erfolg, fügt aber nichts ein, hat der Browser möglicherweise den Zwischenablagenzugriff blockiert; markieren Sie den Vorschautext manuell und kopieren Sie von dort.

Grenzen und Randfälle

• Die Ausgabe ist einfarbig (monochrom); es gibt keinen Farbmodus.
• Es gibt keine Regler für Helligkeit, Kontrast oder Zuschnitt — bereiten Sie das Bild andernorts vor, wenn es angepasst werden muss.
• Das Abtasten eines einzigen Pixels pro Zelle kann dünne Merkmale wie eine ein Pixel breite Kontur verschlucken; Strichzeichnungen profitieren daher manchmal von einer leichten Unschärfe oder einer kleineren Spaltenzahl.
• Fotos mit unruhiger Textur werden zu visuellem Rauschen; einfache, kontrastreiche Motive lassen sich am besten umwandeln.
• Das Kopieren nutzt die Clipboard-API und weicht auf eine Textauswahl aus, falls der Browser sie blockiert.
• Das Ergebnis ist Text und skaliert auf Mobilgeräten schlecht, wo der Umbruch die Proportionen zerstört; halten Sie es in einem horizontal scrollbaren Block.

Verwandte Tools

• Bildkompressor
• Image to Base64
• ASCII-Table