Guide · BeforePixel
Make a sprite sheet in BeforePixel
Animate a pixel-art sprite with BeforePixel's Creative timeline, onion skin and frame timing. Save the editable project, then check a sprite sheet or GIF export.
Updated October 3, 2026.
Build the still sprite first
Open BeforePixel with eligible access and begin on a small canvas. Keep the background and subject on separate layers. Draw the pose you want to repeat, using a palette you can keep consistent across the animation.
Essential covers still-art drawing and PNG export. The frame timeline, onion skin, playback, sprite sheets and animated GIF require Creative animation access. Choose the plan for the output you need before building a sequence.
Use frames to make motion readable
Create the frame sequence in the timeline, then change the subject between poses. Onion skin lets you compare adjacent poses while drawing. Check that the outline and the parts that should stay still remain aligned.
Preview often at the intended playback speed. A small number of clear poses is easier to debug than a long sequence with accidental jumps. Give held poses enough time to read, and shorten the transitions when the movement should feel quick.
Check timing and canvas edges
Review each frame's duration instead of relying only on a general speed setting. Step through the sequence to find stray pixels, disappearing layers and a subject that clips against the canvas edge.
Preview the loop through its end and back to its first frame. The seam is part of the animation. If you are preparing a game asset, check the destination engine's frame size, sheet layout and timing requirements before delivery.
Keep the project and export for the destination
Save a .beforepixel project to retain palette, layers and frame timing. Keep your own file copy outside browser recovery storage. Export a sprite sheet when your destination needs frames in one image, or GIF when you need a readily viewable animated preview.
Inspect the actual exported result. GIF has palette and transparency constraints, so it is not a full-RGBA archive of your work. Keep the editable master and use PNG for a still delivery. Hosted browser-agent pairing is a separate feature and is not part of this released workflow.
Read next
BeforePixel drawing and project basicsA local agent workflow for pixel artBeforePixel setup guide