three.js_

I Built a 3D Blender Clone in JavaScript and It's Actually Usable

Nov 6, 2025 2 min read 375 words
experiments javascript 3d webgl three.js

Blender.js: A 3D Modeling App in Your Browser

Because apparently making a 1D Minecraft clone wasn’t enough chaos, I decided to build a 3D modeling application inspired by Blender. In JavaScript. In the browser. With full 3D manipulation.

The Challenge

Build a usable 3D modeling interface that can:

  1. Create cubes of any size in 3D space
  2. Select individual cubes with mouse clicks
  3. Move selected cubes around in all three dimensions
  4. Provide intuitive camera controls
  5. Actually be fun to use

The Features

  • 🎨 Create Cubes: Adjustable size slider to create cubes from tiny to massive
  • 🖱️ Click to Select: Click any cube to select it (glowing outline shows selection)
  • ⌨️ Keyboard Movement: Arrow keys for XZ plane, Q/E for vertical movement
  • 🎮 Mouse Drag: Drag selected cubes directly in 3D space
  • 📷 Orbit Camera: Click and drag background to rotate camera view
  • 🎯 Grid & Axes: Visual reference grid and axis helpers
  • 🗑️ Delete Cubes: Press Delete/Backspace to remove selected cube
  • 🎨 Random Colors: Each cube gets a unique vibrant color

How It Works

Built with Three.js for WebGL rendering, the app uses raycasting for precise 3D object selection, orbit controls for smooth camera movement, and a custom transform system for intuitive object manipulation.