Threenity mark Threenity

Threenity / Features / Editor

A visual editor for Three.js scenes

Hierarchy, Inspector, Scene view with transform gizmos, a Project browser, and undo/redo — a real scene editor for Three.js, not a demo toy. Below: actual panels from a real project running on Threenity.

Status: the Threenity editor is pre-release. The screenshots are real and current, but the download isn't public yet — it ships to waitlist members first.

Scene view with transform gizmos

The scene view renders your level live on the same Three.js runtime your game uses — what you see in the editor is what ships. Select objects in the viewport, move / rotate / scale them with transform handles, and get a live preview of lighting and materials as you edit.

Threenity scene view rendering a live 3D scene with transform gizmos and the editor toolbar
Scene view — live Three.js rendering with transform gizmos and editor tooling.
Threenity Inspector panel showing a Player object's Transform and CharacterController component with generated fields
Inspector — schema-driven component fields, generated straight from your code.
Threenity Hierarchy panel showing the scene graph with lights, controllers, and the player object
Hierarchy — the full scene graph: GameObjects, lights, controllers, prefabs.
Threenity Project panel showing the asset browser with sprite, atlas, audio, material, and model folders
Project browser — the asset pipeline: sprites, atlases, audio, materials, models.

Hierarchy panel: the whole scene graph

The hierarchy panel shows every GameObject in the scene — lights, cameras, controllers, prefab instances — as the tree it really is. Reparent, activate, and organize; the scene file on disk stays a clean, merge-friendly JSON document.

An inspector generated from your code

Every component declares a schema for its fields, and the inspector renders the right editor for each — numbers, vectors, colors, enums, asset and object references. Add a field to your TypeScript component and it appears in the inspector; no separate editor plugin to write. Material editing works the same way: materials are assets you tweak with live preview in the scene view.

Project browser and safe asset moves

The project browser is your asset pipeline in one panel: models, textures, audio, materials, prefabs. Rename or move an asset and references update automatically — scenes don't silently break.

Undo/redo, done properly

Edits go through a command system, so undo/redo covers scene operations — transform changes, property edits, hierarchy moves — the way you'd expect from a desktop tool.

An editor as a library — mount it in your Vite app

This is the unusual part: the Threenity editor is a library, not a walled-off application. Your project imports it and mounts it into its own Vite dev setup — docking panels included — so the editor runs beside your code, with hot reload on the very components you're inspecting. A desktop app wraps the same editor for a zero-setup experience. Because the editor drives the same runtime as the game, there are no editor-only components and no export translation step.

See it in context

Pre-release: the editor isn't publicly downloadable yet. Join the waitlist and we'll send you the build the moment early access opens.

Join the waitlist