Pixel art for Godot — create the sprite, then import the sheet

1. 01

   Draw it, or let AI draft the first pass

   Start on a real pixel canvas with keyboard-first tools — B pencil, E eraser, G fill, I eyedropper — over a checkerboard that shows exactly which pixels stay transparent. Or turn on the optional AI: type “a small green knight, side view”, pick 16×16 or 32×32, and it drafts a grid-true, transparent first pass. Either way you land real, editable pixels.

2. 02

   Refine on a real grid

   Tidy stray pixels, constrain the palette, and keep the sprite on its grid — 16×16 or 32×32, the sizes Godot slices cleanly. Nothing is locked or flattened: every pixel stays yours to edit right up to export.

3. 03

   Animate on the timeline

   Add frames on a frame-by-frame timeline — up to 32 — and scrub the preview at 1–30 FPS (8–12 is the pixel-art sweet spot). The frame order you see playing is the exact order that gets packed into the sheet.

4. 04

   Export a Godot-ready sheet + atlas

   One click gives you a zip: a uniform-grid PNG where every cell is the same size — so Godot slices it by a horizontal × vertical count — plus a JSON atlas listing every frame’s coordinates and millisecond duration. Upscale 1×, 2×, 4× or 8× with nearest-neighbor so a 16×16 stays crisp.

Godot slices the PNG itself — its importers read the constant-size grid, not the JSON — so the atlas is there to hand you the exact column count, cell size and per-frame timing to type into Godot’s dialog and Speed (FPS) field (and Phaser and Pixi read that same JSON directly). One honest note: Tsubu packs an animation’s frames — drawn, generated or imported — not a folder of loose files.

1. 01

   Add the PNG to your project

   Unzip and drop the sheet PNG into your Godot project’s res:// folder. Godot imports it as a Texture2D — a constant-size grid needs no special import settings.

2. 02

   Create a SpriteFrames resource

   Add an AnimatedSprite2D node, and in its SpriteFrames property choose “New SpriteFrames”. Click the resource to open the SpriteFrames panel at the bottom of the editor.

3. 03

   Add frames from a Sprite Sheet

   In the panel, pick “Add frames from a Sprite Sheet”, select your PNG, and set the number of horizontal and vertical images to match Tsubu’s grid — the atlas JSON tells you the exact column and row counts. Select the frames and click Add.

4. 04

   Set the speed and play

   Set the animation’s Speed (FPS) to match what you scrubbed in Tsubu, toggle Loop if it cycles, and call play() from a script. That is a walk cycle running in Godot.

Rule of thumb: reach for AnimatedSprite2D first — it is built for this. Move to a Sprite2D with Hframes/Vframes and an AnimationPlayer when frame changes have to sit on the same timeline as position, hitboxes or audio.

A creation step done in the browser — before you open the editor

Godot is great at playing a sheet, and there are already plenty of ways to make one: desktop packers, in-engine procedural generators, and AI sprite tools aimed at Godot all exist. Tsubu’s angle is the front half in one editable place — draw or AI-draft a sprite, fix it pixel by pixel, animate it, and export the grid-true sheet, all in a browser tab.

Because the sheet leaves as a constant-size grid with a coordinate atlas, the Godot side stays the quick part: a horizontal × vertical count you can read straight off the JSON, then Add frames.

Grid-true output Godot can actually slice

The thing generic AI “pixel art” gets wrong is the grid — blurry edges, off-grid cells, no clean transparency — a sheet Godot can’t cut evenly. Tsubu keeps every frame on its grid, palette-constrained, on a transparent background, so each cell is the same size and Godot’s horizontal/vertical split lands on the frame boundaries. Pixel-true, not pixel-style.

Grid-true output and atlas export aren’t unique to Tsubu — free packers and Godot-aimed generators export engine sheets too. The difference here is that the frames stay live, editable pixels right up to the moment you export, not a PNG you committed to somewhere else.

AI-assisted, human-refined — and honest about provenance

The optional AI drafts a first pass from a text prompt, or animates a sprite you already have onto the timeline. It is a starting point, not a finished asset: every pixel stays editable, and what the model drafted stays separable so you can disclose it. You can build a whole sheet by hand and never prompt it.

On training data and provenance the wider field hasn’t settled the question, and we’d rather flag that plainly than wave it away — it matters in the Godot community, where disclosure is expected.

Free during early access — with a Google sign-in

Tsubu runs in your browser with nothing to install, and it’s free for early adopters right now, with AI usage sponsored by the platform so there’s no per-generation credit meter. That’s a limited-time launch offer — the honest version of the word, not “free forever”.

There’s no credit card. There is a Google sign-in, which is how your sprites and their editable frames follow you between machines.

Pixel art for Godot — common questions

How do I import a sprite sheet into Godot 4?

Drop the PNG into your project, add an AnimatedSprite2D, and in its SpriteFrames property choose New SpriteFrames. Open the panel, pick “Add frames from a Sprite Sheet”, and set the horizontal and vertical image counts to match the grid — Tsubu’s JSON atlas lists the exact columns and rows. Select the frames, add them, set the Speed (FPS), and play.

AnimatedSprite2D or AnimationPlayer — which should I use?

Use AnimatedSprite2D with a SpriteFrames resource for a sprite that just cycles frames; it carries its own FPS and loop and plays from code. Use a Sprite2D with Hframes/Vframes and an AnimationPlayer when the frames must sync with movement, sound or other property tracks on one timeline.

What are Hframes and Vframes in Godot?

On a Sprite2D, Hframes and Vframes are the number of horizontal and vertical frames in your sheet. Set Hframes to Tsubu’s column count and Vframes to the row count, and the Frame property picks the cell — 0 is the top-left, counting left to right, top to bottom. Because Tsubu’s cells are all the same size, the split lands exactly on the frame edges.

Does Godot read Tsubu’s JSON atlas directly?

Godot slices the PNG itself from the constant-size grid, so it doesn’t need the JSON — but the atlas hands you the exact column count, cell size and per-frame millisecond durations to type into Godot’s dialog and its Speed (FPS) field. Phaser and Pixi, by contrast, read that same JSON directly.

Can I make a Godot sprite sheet without AI?

Yes — AI is entirely optional. Draw every frame by hand on the keyboard-first canvas, or import a GIF or an existing sheet, animate it, and export. No prompt is required at any point.

Is it really free, and do I need an account?

It’s free for early adopters for a limited time, with AI usage sponsored so there’s no per-generation credit cap — a launch-window offer, not free forever. There’s no credit card, but you do sign in with Google, which saves your sprites and frames to a cloud library.