Blender

Blender is a free, open-source 3D modeling program. Think of it as a digital pottery wheel — you start with a lump of digital clay and shape it into whatever you want: a chair, a character, a spaceship, a donut.

In Three.js you can build everything with code — boxes, spheres, custom geometries. But that gets tedious fast. Try coding a detailed tree, a human figure, or a sci-fi weapon using nothing but BufferGeometry and vertex coordinates. You'll be there all week.

Blender lets you sculpt visually, then export the result so Three.js can load it. You model with your mouse, Three.js renders it in the browser.

This post pairs well with Loading Models — that one covers how to load the .glb files you'll export from here.

getting Blender

Go to blender.org and download it. It's free, no trials, no watermarks. It works on Windows, Mac, and Linux.

When you open it for the first time, you'll see a default scene with a cube, a light, and a camera. That cube is your first object.

the absolute basics (just enough to survive)

Blender's interface looks like a spaceship cockpit at first. Here's what matters:

Left side — The 3D viewport. This is where your scene lives.
Right side — Properties panel. This is where you tweak materials, modifiers, and export settings.
Bottom — Timeline (for animation).
Middle mouse — Orbit the view.
Shift + middle mouse — Pan.
Scroll — Zoom.

The most important key: Tab toggles between Object Mode and Edit Mode. You'll spend 90% of your time in one of these two.

Mode	What it's for
Object Mode	Moving, scaling, rotating whole objects
Edit Mode	Poking at individual vertices, edges, and faces of an object

creating objects

Press Shift + A in the 3D viewport. A menu pops up with all the primitives — cube, sphere, cylinder, cone, torus, monkey head (yes, really — it's called a Suzanne).

Click one, and it appears at the cursor.

Shift + A → Mesh → Cube
Shift + A → Mesh → UV Sphere
Shift + A → Mesh → Cylinder

You can move objects with G (grab), rotate with R, scale with S. Press X, Y, or Z after G/R/S to constrain to that axis.

G → move freely
G → Z → move only up/down
R → X → rotate only on X axis
S → scale uniformly
S → Y → squish on Y axis

moving, rotating, scaling (the transform tools)

On the left toolbar (or press T) you'll see icons for:

Select (cursor icon) — click to select objects
Move (crossed arrows) — drag arrows to move on X/Y/Z
Rotate (circle arrows) — drag colored rings
Scale (square with arrows) — drag to resize

In Object Mode, any transform you apply becomes part of the object's position, rotation, and scale in the scene. These are visible in the Properties panel (the little tab that looks like a green square with a downward arrow — the Object tab).

Edit Mode — shaping your object

Select an object and press Tab to enter Edit Mode. Now you're poking at its bones.

The three sub-modes are at the top-left: Vertex (points), Edge (lines), Face (surfaces).

Select a face → press E (extrude) → pull it outward. This is how you turn a cube into an L-shape, a table, or a sword.
Select a vertex → press G to move it around.
Select an edge → press Ctrl + B to bevel (round it off).

E — extrude (pull out new geometry)
Ctrl + B — bevel (round edges)
Ctrl + R — loop cut (add a ring of vertices)
F — fill (create a face from selected edges/vertices)

Extrude is your #1 tool. An enormous amount of modeling is just "select a face, extrude it, repeat."

a quick example — make a simple table

Shift + A → Mesh → Cube (creates a cube)
S → Z → scale it flat for the tabletop
Tab (Edit Mode)
Select the bottom face
E → Z → extrude downward for legs
Tab back to Object Mode

You just made a table. It took 30 seconds.

materials and colors in Blender

Before you export, you probably want to add some color. Select your object, then go to the Material Properties tab (looks like a red sphere, bottom-right of the Properties panel).

Click New, then change the Base Color to whatever you want. That's it. When you export to GLB, the color comes with it.

For textures (images wrapped onto your model), you'd use the Shading workspace — but that's a future post.

exporting for Three.js

This is the part you came for. Blender can export to many formats, but for Three.js you want GLB (binary GLTF) — it's one file, it's small, it bundles textures.

the export settings that matter

File → Export → glTF 2.0 (.glb/.gltf)
Set these options:

Setting	What to pick
Format	`glTF Binary (.glb)` — one file, easy to load
Include	✅ Selected Objects (only export what you selected)
Transform	✅ +Y Up (Three.js uses Y as up, Blender uses Z — this fixes it)
Data	✅ Apply Modifiers (bakes your modifiers into the mesh)
Data	✅ Export Materials (keeps your colors/textures)

The +Y Up checkbox is critical. Blender's world has Z as up. Three.js has Y as up. If you forget this, your model will be rotated 90 degrees sideways.

export checklist before you click

Your object is selected (if you checked "Selected Objects")
Your object has applied scale — select it, press Ctrl + A → Scale. This resets the scale to 1,1,1 so Three.js doesn't get confused.
UVs are unwrapped if you used textures (future post territory)
Materials have sensible names (use lowercase, no spaces if you can)
+Y Up is checked

loading your exported model in Three.js

Your model is a .glb file now. Put it in your project's static folder and load it with GLTFLoader:

import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js';

const loader = new GLTFLoader();

loader.load('/models/my-table.glb', (gltf) => {
    const model = gltf.scene;
    scene.add(model);
});

That's it. Your Blender model is now running in the browser. For a full breakdown of loading, error handling, and cleanup, see Loading Models.

common problems and fixes

my model is sideways

You forgot +Y Up in the export settings. Re-export with it checked. Or in code: model.rotation.x = -Math.PI / 2; as a band-aid.

my model is tiny or huge

Blender units don't map 1:1 to Three.js units. You can scale in the export settings (set Size to something like 0.01 if your model is meters and Three.js expects centimeters) or scale in code: model.scale.set(0.01, 0.01, 0.01);

my model has no color

You used a material in Blender that doesn't export cleanly to GLB (like a shader with nodes). Stick to Principled BSDF with a simple Base Color for now.

my model looks wrong / has weird shading

You probably forgot to apply the scale (Ctrl + A → Scale) before exporting. Normals get confused when the scale isn't 1. Also check if your faces are flipped — in Edit Mode, select all (A) and press Shift + N to recalculate normals.

what's next?

This covers the absolute basics — enough to create a simple object and get it into your Three.js scene. Blender is a massive program (people have careers doing just one part of it), so don't feel pressured to learn everything at once.

Future posts could cover:

UV unwrapping — so textures wrap around your model correctly
Sculpting — shaping organic forms like characters
Rigging — adding bones for animation
Modifiers — arrays, mirrors, subdivision surfaces

But for now: open Blender, make a cube, extrude it, export it, load it in Three.js. That's the entire pipeline, end to end. Everything else is just fancier cubes.