A tiny, type-safe toolkit on top of Three.js. Lighting, orbit controls, model loading, animation and click-to-pick interaction, wired together behind a fluent API, so you start from a scene instead of a blank canvas.
Reach for it when you're building product configurators, immersive stories, data visualisations, architectural walkthroughs: anything that needs to feel alive in 3D.
Everything below ships in the box and is fully configurable: sensible defaults first, full control when you need it.
The loop draws a frame only when something actually moves. Static scenes idle at zero, easy on laptops and battery.
Every method returns this, so setup reads top to bottom. Full TypeScript types and JSDoc come bundled.
Hemisphere fill, key & fill directional lights, soft shadows and ACES tone mapping in one call, instantly presentable.
Load an asset once, clone it as many times as you like. Ideal for scattering props, instances and repeated geometry.
Click, hover and right-click on meshes, with click-vs-drag discrimination, so orbiting never fires a stray click.
Tween colour, position, opacity and the camera with tween.js, and drop a panoramic image in as a background.
No scene graph wrangling, no render-loop plumbing. Compose what you need and let the library handle the rest.
dispose() cleans up the renderer and memoryimport { SceneCreator } from "3d-scene-creator";
// Lighting, orbit controls and a 360ยฐ backdrop, chained.
const scene = new SceneCreator(container)
.addLighting()
.addControls({ enableDamping: true })
.addSkybox("/venice-sunset.jpg");
// Load once, drop it in, give it shadows.
const model = await scene.loadGLTF("/chair.glb");
model.name = "Chair";
scene.scene.add(model);
scene.applyShadows();
// Click a mesh โ tween its colour over 0.6s.
scene.enablePicking((obj) => {
scene.animateModelColor(obj.name, "#6366f1", 0.6);
});
Each example is a small, self-contained scene built with the same API the demo above uses. Open one and read the source.
An immersive skybox you can look around, a panoramic image dropped straight into the scene background.
Open example โLoad a rigged glTF robot from a CDN and play its skeletal clips: movements, emotes and facial expressions.
Open example โHover, click and right-click meshes in real time, with click-vs-drag discrimination on mouse and touch.
Open example โDrop shapes that fall, bounce and stack under gravity, with rigid bodies powered by cannon-es.
Open example โAdd it to any Three.js project. It's a thin layer, not a framework. You keep full access to the scene, camera and renderer.