Tool guide

ASCII Animation Editor Online — Frame by Frame

This is a frame-based canvas for character animation: pick the brush symbol, draw a frame, add the next one and watch the sequence play back at the frame rate you choose. Export the finished scene as a GIF, as a native video capture or as a JSON list of frames you can replay from your own code — a CLI spinner, a README demo or a terminal-styled hero section. Frames live in the browser tab only. See also: terminal typing animation maker, big ASCII letters for a frame, turn a picture into an ASCII frame.

How to use it

Type the drawing symbol into the Char field — it starts as "#", but any character works, including block glyphs.
Draw the first frame on the character grid, then press the plus button on the frame strip to push the next frame onto the timeline.
Use the copy button beside it to duplicate the current frame — shifting a copy by one cell is the easiest way to get smooth motion.
Set playback speed with the FPS slider, from 1 to 30 frames per second, and pick a glow colour.
Press "RUN" (Run) to preview the loop and stop the preview when you want to edit frames again.
Export with the GIF, VIDEO (Native) or JSON button — JSON keeps the raw frames for your own player.

FAQ

How many frames can the timeline hold?

Expect a few dozen frames in practice. The whole sequence stays in tab memory and the GIF is encoded by the browser itself, so long sequences make export slow on modest hardware. Split longer pieces into 20-30 frame scenes and stitch them together in a video editor.

How does VIDEO (Native) differ from the GIF export?

The GIF is assembled frame by frame with gifshot and gives you a small looping file for a README or a chat. VIDEO (Native) records through the browser's own capture API, so the container depends on the browser and is usually WebM rather than MP4. Transcode afterwards if you specifically need MP4.

Can I animate non-Latin or block characters?

Yes — the Char field takes any single Unicode character, including Cyrillic letters and block glyphs. Just keep to a monospaced font so columns line up. Emoji technically paste in but occupy two cells, which breaks the grid alignment, so avoid them if you want an even animation.

The GIF button did nothing. What now?

Usually a popup blocker or a download-blocking extension is intercepting the file; allow downloads for this page and try again. The other common cause is exporting while playback is running — stop the preview, wait for the grid to come back, then export.

What is the JSON export good for?

JSON gives you the frames as plain strings instead of an image. Drop the array into your own script, step through it on a timer and print each frame to the console or into a element. The result weighs a couple of kilobytes and stays editable, unlike a rendered GIF.

Are frames kept after I close the tab?

No. The project lives in the memory of the open page and nothing is synced anywhere. Export the JSON before you leave — it is tiny and doubles as the project file you can reload frames from.

Examples

Spinner for a command-line tool

Before: Frame 1: [# ] Frame 2: [ # ] Frame 3: [ # ] Frame 4: [ #]

After: JSON export: ["[# ]", "[ # ]", "[ # ]", "[ #]"] at 8 FPS — a half-second bouncing-dot loop.

Blinking cursor for an intro

Before: Frame 1: user@host:~$ _ Frame 2: user@host:~$

After: A two-frame GIF at 2 FPS: the cursor blinks twice a second and the file stays in the tens of kilobytes.

ASCII Animation Editor Online — Frame by Frame

How to use it

FAQ

Examples

Rate this tool