How to use

Spine Preview is a free, browser-based Spine skeleton viewer for Esoteric Software Spine exports (runtime 3.8 and 4.3). Load your atlas and skeleton locally — nothing is uploaded — then play animations, switch skins, and export PNG frames or a full spritesheet.

Step 1 — Export from Spine Editor

Open your project in Spine and choose Export.

Enable JSON (recommended for Spine 4.x beta) and/or binary .skel.

Export the texture atlas: a .atlas file plus PNG/JPG images.

For Spine 3.8.x, upload .atlas, .json or .skel, and all textures together.

For Spine 4.x, JSON is preferred if binary alone fails to load.

Step 2 — Import into the viewer

Drag and drop all export files onto the Import drop zone, or click Browse.

If multiple skeletons are detected, pick one from the Skeleton dropdown.

Wait for the status line to confirm load; runtime version appears under Info.

Step 3 — Preview animations & skins

Use the Animation button group; click Play / Pause.

Adjust Speed (0.1×–3×) and switch Skin.

On canvas: scroll to zoom, drag to pan, or use toolbar Fit to view.

Step 4 — Export PNG or spritesheet

Single frame: pause on the pose, then Save frame (paused).

Spritesheet: choose By FPS or frame count, set Scale, Cols/Rows, Transparent BG.

Enable Spritesheet JSON for frame coordinates in Animate or Metadata.

Frames align from skeleton origin (0, 0) — match Cols, Rows, and Gap 2 in Animate preview.

Frequently asked questions

Is my project uploaded anywhere?: No. Files stay in your browser; rendering runs locally via WebGL (PixiJS).
Why does 4.3 .skel fail?: Beta binaries may be incompatible. Re-export with JSON and include atlas + images.
Which Spine versions are supported?: Spine Editor 3.8.x (runtime 3.8) and 4.x up to 4.3. Runtime is picked automatically.

Spine preview

Import a skeleton to begin