viz3d

Visualize anything in 3D. Give your agent a subject: a place, a system, an object, a product, a creature, a story or an idea. The agent researches it, builds models to real dimensions, and makes a film, an app you click through, a lesson, a book or a game. It checks its own frames before it shows you anything.

Films and stills render in 67js, our WebGL2 engine that agents drive through an MCP server: JSON scene recipes, PNG review grids, and GPU or CPU export to images and video with bounded memory. viz3d works without it, and looks better with it. See Films and stills with 67js.

1. Install the plugin.
2. Type /viz3d with nothing after it. The agent shows the menu of modes and looks.
3. Type a mode, a look if you want one, and the subject: /viz3d film white model the Chernobyl accident.

Put the subject in quotes when it starts with a mode or look word: /viz3d "film noir city".

You can also skip the command and ask in your own words. The agent picks the mode and the look from the subject.

The nine modes fall into three groups, by what people do with the result.

Watch it

• Documentary film (film): a 2 to 4 minute film of an event, told in order. It is built from a sourced fact file, a map, block-built scenes and flat glowing figures. Captions are timed for reading, and the score changes with the story.
• Action short (action): creatures, machines or characters doing something, such as a fight, a chase or a launch. Every move is planned beat by beat, and every hit lands on a visible contact. The agent checks the frames for hidden or mistimed actions before it shows you the film.
• Showcase (showcase): a film or a set of stills that shows off one object, product or model. The model stays clean while the world around it turns to ASCII or glow.

Explore it

• Live app (app): a three.js app with a dashboard around a 3D world of the place. A seeded simulation moves the units and the numbers. The agent records a 30 s film by driving the app with real clicks on a virtual clock.
• Lesson app (lesson): a step-by-step lesson on a real object at real size, such as an Arduino and a breadboard. Parts and wires plug in as they do on a desk. The highlighted code line is what the board does right now. A free bench lets the learner build their own circuit.
• Book (book): a 3D illustrated cutaway plate of one big object or building, such as a liner or a castle. You orbit it, read the margin labels and fly into any room, each full of small people at work. Several subjects make a page-turning book with a short quiz on each page.
• Game (game): a free browser game people play. The player steers one creature or unit through an open world that pushes back. It grows by playing and starts again from a death card. Bots play it before you do, to balance it and to find stuck states.

Put it in your product

• Quick prototype (prototype): a live app in one pass from three.js primitives, with no Blender. Use it when you need something to show your leads this week.
• Live embed (embed): the 3D view as a web component (<viz3d-world>) or an iframe page. It goes into the dashboard or product you already have. It reads your real data through a field mapping file, from REST, Server-Sent Events, WebSocket or a CSV export. A new feed needs no code change. Tokens stay on your backend.

Documentary film	Action short
Showcase	Live app
Lesson app	Book
Game	Quick prototype
Live embed	Stage cameras in a live app

Every live app has stage cameras on number keys, a guided tour and a follow camera, as in the metro app above. Playback runs from 0.25x to 10x.

The thirteen looks fall into four families. Put the look word in your command, or leave it out and the agent uses the default look for the mode.

Layer build	ASCII
Space-time cube

Default looks: apps, prototypes, embeds and lessons use clean ops world. Films use dark documentary, showcases use Dither + ASCII and books use the cutaway plate. You can show the agent a reference video of a new look. It studies the frames and writes the look up for next time.

A real place starts from its real layout. The agent draws the plan from OpenStreetMap data and builds the 3D world on the same coordinates, so the two line up. Things then work as they do in reality. Aircraft follow the taxiway centre lines and give way to each other. Jet bridges and service vehicles attach to the real doors and ports, and the agent measures every gap before it records.

1. It writes a plan file: the real parts of the subject, what moves, the beats, the look and the camera.
2. It gets the models: ready models and scans first, then Blender builds from reference pictures.
3. It builds the app or the film from the plan file.
4. It checks its own frames on contact sheets for up to three rounds and fixes what it finds.
5. It sends you a fast low-quality preview of the whole film. The full render waits for your sign-off.

The skill asks before it downloads anything, such as elevation data, map data or reference images.

In Claude Code, add this repository as a plugin marketplace and install the plugin:

/plugin marketplace add codepawl/viz3d
/plugin install visualize-in-3d@codepawl

From a shell, the same two steps are:

claude plugin marketplace add codepawl/viz3d
claude plugin install visualize-in-3d@codepawl

For Claude Code, Codex, Cursor and other agents that read skill folders, use the skills CLI:

npx skills add codepawl/viz3d

To install by hand, copy both folders in plugins/visualize-in-3d/skills/ (visualize-in-3d and the viz3d command) into your agent's skills folder:

Gemini CLI and OpenCode take slash commands from their own folders. To get /viz3d there, also copy the command file:

How you type the command depends on the agent:

For a live embed, the agent builds a web component and an iframe page. Put the component in any page and point it at your feed:

<script type="module" src="/viz3d-world.js"></script>
<viz3d-world source="https://ops.example.internal/events" mapping="/mapping.json" chrome="panel"></viz3d-world>

mapping.json links your field names and status codes to the 3D view, so a new feed needs no code change. For a tool that only takes a URL, use embed.html?source=... in an iframe. To test without your real system, the skill's scripts/mock-feed.mjs replays a JSONL file as a live feed.

Apps, lessons, embeds and games stay in three.js, because people click and steer them. Documentaries, action shorts, showcases, cutaway films and stills render in 67js when it is installed:

• Addons give terrain, scanned trees and grass, baked liquid, vehicles on paths and skinned characters. Others give HDRI light and baked room light.
• The agent builds the scene as a JSON recipe through MCP and checks it on labelled review grids. It tries two or three looks as branches and shows you the grid to pick from.
• A timeline of shots with fades and depth of field drives the clock. Any frame renders the same in any order.
• Render jobs export PNG and MP4 with the soundtrack and an audio sync check. Memory is planned before it is used.
• Films longer than one render job are split, joined and checked. A 70 s test film showed no jump or sound gap at the joins.

Set it up in your project:

npm install 67js@npm:@codepawlhq/67js

claude mcp add 67js-scene -- npx --package @codepawlhq/67js 67js-mcp --backend gpu --memory 256

npx skills add codepawl/67.js

The last command adds the 67js skills (build-67js-scene and render-67js-media). The skill's references/67js.md has the full workflow, Windows notes and the faults we have seen. Showcase and docs are at 67js.codepawl.com. If viz3d is useful to you, a star on codepawl/67.js helps the engine behind it.

• Node 20 or later, with Playwright and Chromium for recording.
• ffmpeg on your PATH.
• A GPU that runs WebGL2 at 1080p.
• Blender 5.x is optional. It gives much better models for the full live app and the documentary. Without it the skill builds the models in three.js and tells you the quality is lower. Quick prototypes and embeds never need it.
• 67js is optional. It renders the films and stills, as described above.

• viz3d now covers any subject, not only things that are hard to understand.
• The showcase mode: a film or stills that show off one object, product or model.
• /viz3d with nothing after it shows the menu. The menu groups the modes by what people do with them and the looks by family.
• Films and stills render in 67js when it is installed.
• The game mode: a playable browser game, balanced by bot playtests.
• A longer self-review fault list. It checks contact and support, camera flights through meshes, vehicles that steer and roll, and sound.

build-minecraft-model-from-image turns a picture of an object into a Minecraft-style 3D model. The agent looks at the picture and writes the model as code: a few cuboids with pixel textures. It does not use a fine voxel grid or an image-to-3D network. You get a GLB, a viewer page, renders from every side and a sheet that compares them with the picture. It needs Python through uv and Blender 5.x for the renders.

/plugin install build-minecraft-model-from-image@codepawl

Photo credits for the picture above and the skill's examples/: kettle and armchair by Auckland War Memorial Museum (armchair photo by Gerald E Jones), CC BY 4.0. Rubber duck by Julian Lupyan, CC0. Fire hydrant by Tournasol7, CC BY 4.0. All from Wikimedia Commons.

build-house-from-plan turns a 2D house plan into a photoreal 3D house. The agent reads the walls, doors, windows and scale off the drawing into a plan file. A check overlays the built walls on the drawing's ink and fails when they do not line up. The house gets measured wall thickness, real frames and glass, CC0 scanned materials and real furniture models, and renders in Blender Cycles. You get stills, a film of the walls rising off the drawing, and whole streets. It needs Python through uv, Blender 5.x and a GPU.

/plugin install build-house-from-plan@codepawl

The plans behind the picture are public domain. They are Historic American Buildings Survey and Historic American Engineering Record sheets from the Library of Congress, and a USDA plan. Furniture includes CC BY models listed in the skill's example.

Faults you saw, new looks, example topics and harness adapters are welcome. Read CONTRIBUTING.md. Coding agents read AGENTS.md.

MIT