Make your first sprite, step by step.
Start with a short clip, review a few frames, then expand your project.
1. Import a video or image
Choose Choose Video or Choose Image in the editor. You can open one still PNG, JPG, WebP or BMP image at a time. GIF, SVG and animated PNG/WebP are not supported. For images over 4096px on the longest side or 9 million pixels, reduce the output resolution in File & Removal before selecting the file again.
Your browser must support the video codec. Set a start and end time, output resolution and FPS, then choose Extract Frames. Try 1–3 seconds at 12FPS first: 2 seconds × 12FPS produces 24 frames. Choose original resolution to retain the source pixel dimensions.
2. Run automatic background removal
Auto Remove Background processes all frames. To inspect one first, use the selected-frame removal button in File & Removal. The first run also prepares about 66MB of AI cache files. Your media is not uploaded.
Wait for completion or use Stop. During AI processing, stopping takes effect after the current frame finishes computing; completed frames are retained. You can undo the operation.
A higher background-color threshold can remove more background but may also erase the subject. Change the value and run removal to apply it. Outer-only removal can protect interior decorations but may leave gaps between hair strands. Rerunning automatic removal starts from the original, so manual edits can change.
3. Zoom in and refine
- Erase removes remaining background; Restore brings back original pixels, which may include the original background color.
- Pick Residual Color collects multiple colors for the current frame or all frames. Check whether a color also occurs on the subject and protect regions when needed.
- Connected-region erase removes similar colors connected to the clicked point. Mask contraction/expansion adjusts edges and may affect thin details.
- Zoom with the scale menu, +/− or Ctrl+mouse wheel. Pan with Alt/Space+drag or the Move tool.
- Press F for the expanded editor and Escape to exit. Compare with the original and check edges on light, dark or pink backgrounds.
- Duplicate, delete and reorder frames in the strip. Left/Right selects frames; Ctrl+Z undoes. Play the animation on the main canvas to inspect motion.
4. Save results and a project separately
For one image, use Save Image PNG. In Export, choose columns and padding for a PNG sprite sheet. Use multi-page sheet ZIP export for large projects: the ZIP includes PNG pages and frames.json. Individual-frame PNG and frame-coordinate JSON are also available.
Use Save Project to keep a .spriteproj file for later editing. It contains extracted originals and edited frames, but not the original video file itself. Reselect the video to extract a new segment. There is no autosave.
Frequently asked questions
Does the background have to be green?
No. Default removal uses a character-focused AI model and can process other colors and complex backgrounds. It also uses color processing for consistent solid backgrounds. Photographs and subjects resembling the background may need correction. Existing source transparency is preserved where applicable.
What if processing is slow or memory runs out?
Shorten the segment, lower FPS or frame count, or split the project. Supported environments use up to four threads; others fall back to one. The 600-frame cap does not guarantee that every device can process that many. There is no fixed processing-time promise.
Why does the frame look smaller or its edge look different?
Fit-to-screen zoom changes display size. Original-resolution extraction retains pixel dimensions, though video decoding and translucent edge processing may change colors.
How does the editor work on narrow screens?
The editor and ad space occupy separate columns; the ad space stays on the right. Narrow screens retain the editor’s minimum width and use horizontal scrolling. A wider display is more comfortable for precise brush editing.