Image to ASCII art
Turn an image into ASCII art: choose 20–200 columns, tune the aspect ratio, pick from four character sets (classic, blocks, minimal, Chinese), invert the result and export plain text or colored HTML.
Runs in your browserEvery computation happens in your browser — your data never leaves this device.
Images are processed locally in your browser.
No image selected yet
Choose an image first
What this tool does
- Turn a picture into ASCII art for a terminal-style cover, a README illustration or a chat easter egg — pick anything from 20 to 200 columns and the preview updates live.
- Compare the four character sets: classic @%#*+=-:. has the most levels, blocks █▓▒░ builds shading from solid glyphs, minimal @. only has two levels, and the Chinese set 重墨中浅淡· fits CJK typography.
- Produce colored HTML: enabling the colored output gives every character the original pixel color, and the downloaded .html opens as a full-color ASCII render.
- Preview tonal structure quickly: the aspect compensation squeezes character height by 0.5 so the art does not come out vertically stretched.
Example
Input
A 200 × 200 image, pure black on the left half and pure white on the right, exported at 80 columns with the classic set
Output
80 columns × 40 rows; the first row is 40 "@" characters followed by 40 spaces (each cell covers roughly 2.5 × 5 pixels)
The row count is round(height / width × cols × aspect) = round(200 / 200 × 80 × 0.5) = 40. Black has luminance 0 and maps to the darkest character @, while white (255) maps to the trailing space. The whole render is deterministic pure logic reproducible from the command line; picking the file relies on the browser decoder.
Frequently asked questions
Why does the ASCII art look squashed or stretched?
Terminal characters are roughly twice as tall as they are wide, so the default 0.5 aspect compensation halves the row count. Drag the aspect control to change the vertical proportion: higher values flatten the image, and values near 1 approach the square row count.
How do the four character sets differ?
Classic @%#*+=-:. offers ten gray levels and the finest detail, best for photos. Blocks █▓▒░ uses solid glyphs that nearly touch in a monospace font, which reads more like pixel art. Minimal @. keeps only black and white, ideal for silhouettes. The Chinese set 重墨中浅淡· uses stroke density for tone and fits CJK typesetting.
What is invert for?
Invert flips the luminance-to-character mapping, so the brightest pixels get the densest characters. It is most useful on light backgrounds: instead of a white page turning into empty space, the background becomes dense text and the subject turns light, which matches the usual dark-on-light reading expectation.
Where do the colors in the HTML export come from?
Each cell keeps the average RGB of the area it covers. In colored mode, runs of identical color are merged into a single <span style="color: #RRGGBB;">, so the HTML is noticeably larger than the plain text but the colors are accurate. Plain text mode emits only the characters, ready for a terminal or a source comment.
Are my images uploaded?
No. The image is decoded locally, each cell is averaged and mapped to a character, and the plain text, colored HTML and downloads are all produced in the browser. There is no upload endpoint.
Keywords：图片转字符画image to asciiascii art字符画文字画像素画ascii 艺术图片字符化