Spine Viewer Online

How to view a Spine animation online

In Spine, export your skeleton as JSON or Binary (.skel) with a texture atlas.
Drag the .json/.skel, the .atlas and all .png pages onto the preview — or click Open folder and pick the export folder.
Click an animation on the right to play it. Switch skins, change speed and mix time, and drag / scroll the canvas to pan and zoom.
Turn on debug overlays to check bones, mesh triangles, bounding boxes, paths and clipping.
Export the current animation as an animated GIF, a WebM video, a ZIP of transparent PNG frames, or a single snapshot.

Features of this free Spine animation viewer

JSON and binary skeletons — open .json and .skel exports with their .atlas and texture pages, including multi-page atlases.
Animation & skin preview — play every animation, scrub the timeline frame by frame, change speed and mix duration, and combine several skins to test mix-and-match setups.
Debug overlays — draw bones, region attachments, mesh triangles and hulls, bounding boxes, paths and clipping to find rigging problems fast.
Live event log — see each Spine event (with its int, float and string values) as the animation fires it, handy for checking sound and VFX hooks.
Export — turn any animation into an animated GIF, a WebM video, or a ZIP of transparent PNG frames for sprite sheets, store pages and social posts.

Who is it for?

Game developers checking an artist's export before importing it into Unity, Godot, Phaser, PixiJS or Cocos; animators sharing a quick preview with a client who doesn't own Spine; and QA testers verifying skins and events without opening the editor.

Which Spine versions are supported?

This viewer is built on the official Spine 4.2 WebGL runtime, including 4.2 physics constraints. It reads the version stored in your skeleton file and automatically switches to the matching 4.1 or 4.0 runtime when needed. Spine 3.x files must be re-exported from Spine 4.x (the 3.x data format is not compatible with 4.x runtimes).

Unity & game-engine exports

Unity-style names such as hero.skel.bytes and hero.atlas.txt are recognised automatically, so you can drop files straight from your Assets folder.

Premultiplied alpha (PMA)

If you see dark fringes or halos around images, toggle PMA so it matches the "Premultiply alpha" option you used when packing the atlas. Spine 4.x atlases that declare pma: true turn it on automatically.

Frequently Asked Questions

Yes. The Spine viewer is completely free with no sign-up and no watermark on exports.

No. Your skeleton, atlas and textures are read and rendered entirely in your browser with WebGL. Nothing is uploaded.

Yes. It runs the official Spine 4.2 runtime, including physics constraints. 4.1 and 4.0 files are detected and played with their matching runtime automatically.

Yes. Both JSON (.json) and binary (.skel or .skel.bytes) skeleton exports are supported, together with .atlas or .atlas.txt files.

Every page listed inside the .atlas file must be selected too. Select all PNG files from the export (or use Open folder) so the viewer can match each atlas page by file name.

Yes. Choose an animation, then export it as an animated GIF, a WebM video, a ZIP of PNG frames with transparency, or a single PNG snapshot.

Drop your Spine export here