Diorama (educlopez): animated isometric illustrations
/diorama-pixel
Three agent skills that turn a description of a place into one self-contained offline HTML file: Diorama SVG (six themes), Diorama Worlds (Three.js miniatures, four finishes) and Diorama Pixel (dithered pixel art, no dependencies).
- GitHub stars
- 3 (GitHub stars as of 2026-10-25)
- License
- MIT
- Last commit
- 2026/10/22
- By
- educlopez
Listed from the author's README. GameSkill has not run this end to end yet. Agent support and install steps are as documented by the author.
Install
npx skills add educlopez/diorama --skill diorama -gnpx skills add educlopez/diorama --skill diorama-worlds -gnpx skills add educlopez/diorama --skill diorama-pixel -gAdd -a claude-code or -a codex to target one agent; omit -g to install per project.
Commands are copied from the project's README. Check the repository before running anything on your machine.
Install for a specific agent
| Agents | -a | Folder |
|---|---|---|
| Claude Code | claude-code | .claude/skills/ |
| Codex | codex | .agents/skills/ |
| Cursor | cursor | .agents/skills/ |
| Gemini CLI | gemini-cli | .agents/skills/ |
| GitHub Copilot | github-copilot | .agents/skills/ |
| OpenCode | opencode | .agents/skills/ |
| Windsurf | windsurf | .windsurf/skills/ |
Add -a <flag> to the command. These are project folders; add -g to install for your user account instead.
What you get
- diorama: dependency-free SVG figures in six tunable themes, about 30-35 KB gzip
- diorama-worlds: Three.js miniature stories with articulated people; miniature, pixel, halftone and blueprint finishes
- diorama-pixel: 320x240 software rasterizer with Bayer dithering and procedural textures, about 16 KB gzip
- Example scenes and guides at dioramas.dev
Good fit
- Cozy isometric or pixel-art vignettes for game sites, devlogs and store pages
- Lightweight animated illustrations with no build step
Not for
- Interactive gameplay
About this skill
Describe a place and get one offline HTML file. The three skills share no renderer or dependency, so install one, two or all three. Diorama Pixel is the one closest to game art: dithered pixel miniatures drawn by its own canvas rasterizer, with no Three.js.
The project is small in stars but active, with 39 commits, release-please versioning and a docs site at dioramas.dev.
Related
- Diorama (sloemo01) for Three.js pixel dioramas with an animated cast.
Requirements
- Node.js 20 or later
Topics
FAQ
Works well with
Skills the author points to as related or as the better fit for neighbouring tasks.
Diorama (pixel-art Three.js dioramas)
A one-file agent playbook plus a Three.js code kit for small pixel-art isometric dioramas: research-first builds, locked camera, 64-colour palette snap, ordered dither, inked contour and an animated toy-scale cast, with per-frame QA.
pixelwright
Three agent skills and a numpy + Pillow CLI that turn AI renders into true pixel art (grid snap, palette lock, cleanup, tiles) and animate stills in code inside masks, with gates that prove every result.
Similar skills
Godogen
Autonomous game development with Claude Code and Codex. Publishes a ready game repo for Godot, Bevy, Babylon.js or three.js.
Hermes GameForge
A game-development plugin for Hermes Agent with 10 agent skills and 9 tools: SFX, music, NPC voices, pixel sprites, tilesets, low-poly 3D, web/Godot/Unity builds, a playtester that plays the build, and itch.io export. Runs offline by default.
rng-vfx
A game VFX skill for coding agents: six styles (anime, toon, stylized, dark fantasy, pixel, realism) for Unity VFX Graph, Unreal Niagara and three.js, with a live three.js stand to verify frame strips.
img2threejs
An Agent Skill that rebuilds the object or character in a reference image as a code-only, animation-ready Three.js model, checked pass by pass.