Spritesheet preview
Preview a Codex pet spritesheet URL and pet.json before install.
Paste a browser-accessible WebP or PNG spritesheet URL, then inspect the full 9-state atlas, scale, pin, and mouse-follow behavior. Use the local ZIP checker to verify the files inside a package, or paste pet.json for a quick text-only check before you copy files into Codex.
Manifest check
Use preview when the package shape is uncertain.
This preview uses the catalog's 1536 by 1872 atlas: eight columns and nine rows of 192 by 208 pixel cells. A different layout can load successfully but show cropped or mixed-up frames. In pet.json, keep spritesheetPath aligned with the actual image file. For a newly generated package, follow the installed generation skill's current format; this browser preview is not a compatibility test for every Codex version.
The manifest checker validates JSON, required text fields, the ID format, and the image filename suffix. A green result does not prove that the image exists, has the correct dimensions, includes every animation, or can be installed. Use the visual checks below before copying files into Codex. The separate local ZIP checker reads the actual files, checks ZIP integrity and decodes the PNG/WebP image at the expected atlas size. It still cannot prove animation quality, licensing or installation in your version of Codex.
Open the image URL directly. It should return the image, not a sign-in screen, repository file page, or expired download. A path on your computer is not a public image URL. Try a bundled sample to separate a custom-image problem from a preview problem.
If pieces of adjacent poses appear, compare the image dimensions and grid with this renderer's layout. A different cell size changes where every frame is cut. Scaling the preview cannot repair a mismatched atlas; regenerate or export the correct grid first.
A valid manifest can still name a missing image. For a downloaded package, keep pet.json and spritesheet.webp together in ~/.codex/pets/<pet-id>/, and match spritesheetPath to the actual filename. Then verify the pet inside Codex; browser playback alone does not verify a local installation.
How to use
How to use the Codex pet preview tool
- 01
Load a spritesheet
Paste a public WebP or PNG spritesheet URL, or start with one of the bundled example Codex pets.
- 02
Check the animation rows
Use the 9-state grid first, then switch the large preview when you need to inspect one animation row in detail.
- 03
Tune the display
Adjust scale, pin mode, draggable floating behavior, and desktop mouse follow so you can test how the pet will feel inside Codex.
- 04
Validate the manifest
Paste pet.json to check its required fields and filename. Separately inspect the image dimensions and animation rows; the JSON checker does not load or verify the image.