# A visual guide to voxels

# What's a voxel?

A voxel is to 3D what a pixel is to 2D.

A **pixel** is a tiny square in a 2D image. A grid of pixels makes a picture. Your screen is a grid of pixels. Zoom into any photo and you see them.

A **voxel** is a tiny cube in a 3D space. A grid of voxels makes a 3D world. Minecraft is the famous example. Each block in Minecraft is essentially one voxel.

The word "voxel" comes from "volume element," same way "pixel" came from "picture element." That's the whole origin of the name.

![](https://cdn.hashnode.com/uploads/covers/60bb3fa2fffc4c13b9cd5935/e0496141-f10e-44ef-bc4a-b7e3703716f7.png align="center")

# What a voxel actually stores

The cube shape is just for visualizing. A voxel is really a cell in a 3D grid that stores some data.

What data? Whatever you need:

*   1 bit: solid or empty
    
*   1 byte: which material (stone, dirt, water, air)
    
*   More bytes: material plus light level plus temperature plus whatever
    

In code, a voxel grid is just a 3D array:

```js
voxels[x][y][z] = someValue
```

Every cell holds a value. The values together describe the world.

A useful way to think about it: voxels are not really cubes. They are points in a grid that happen to get drawn as cubes when you render them. **The "cube" is a rendering choice, not a property of the voxel.**

# How big do voxel worlds get?

Storage adds up fast.

A grid of 256 by 256 by 256 voxels has about 16 million cells. At 1 byte each, that's 16 MB. Manageable.

A grid of 1024 by 1024 by 1024 voxels has about 1 billion cells. At 1 byte each, that's 1 GB. Too much for most cases.

Two tricks games use to deal with this:

**Chunks.** Split the world into smaller blocks of voxels. Minecraft uses 16 by 16 by 256 chunks. Only keep the chunks near the player in memory. Load them in as the player walks toward them, unload them as the player walks away.

**Sparse storage.** Most voxels are usually empty (air). Don't store them at all. Use a tree structure called an **octree** that splits 3D space into 8 child cubes recursively, only storing the child cubes that contain something. Empty regions take almost no space.

These are engineering details, not voxel concepts. The core idea stays the same: a 3D grid of data.

![](https://cdn.hashnode.com/uploads/covers/60bb3fa2fffc4c13b9cd5935/e29c17da-446a-4eea-b751-99c7108cd744.png align="center")

# What voxels are good for

Three main reasons people use voxels:

1.  **Destructible or modifiable worlds.** Changing a voxel is easy. Flip a 1 to a 0 and there's a hole. With a normal triangle mesh, modifying geometry mid-game is much harder. Games like Teardown and Minecraft lean on this.
    
2.  **Procedural generation.** Filling a grid with numbers is something computers do well. You write a noise function, sample it at every grid point, and terrain appears. No artists needed.
    
3.  **Medical and scientific data.** MRI and CT scans naturally produce voxel grids. Each cell holds a density value from the scan. Same data structure, completely different field.
    

* * *

# What's hard about voxels?

Two big challenges.

**Memory.** As shown above, voxel grids are huge. Storing them is one problem. Sending them to the GPU each frame is another.

**Rendering.** A GPU draws triangles. Voxels are not triangles. You have to convert your voxel grid into triangles before you can draw it. This conversion is called **meshing**, and it's where most of the complexity lives.

* * *

# Three ways to render voxels

There are three common approaches:

**1\. Just draw cubes.** Each solid voxel becomes a cube made of 12 triangles. Optimization: skip faces that are hidden inside the world. This is what Minecraft does. Output is intentionally blocky. Looks like Minecraft.

**2\. Smooth the surface.** Treat the voxel values as a continuous field. Find where the field crosses zero and draw a smooth surface there. This is what **marching cubes** does. Output is smooth, no visible cube faces. Used for natural terrain, caves, organic shapes.

**3\. Ray march.** Don't make triangles at all. For each pixel on screen, walk a ray through the voxel grid and find what it hits. Slower for big scenes but supports things triangles can't, like translucent fog or true volumetric effects.

![](https://cdn.hashnode.com/uploads/covers/60bb3fa2fffc4c13b9cd5935/becc0cdc-89d0-42d7-81f6-1f203c986500.png align="center")

* * *

# The mental shift

A voxel is data. The cube is just one way to draw it.

Same voxel grid can become:

*   Blocky Minecraft terrain
    
*   Smooth natural mountain
    
*   A semi transparent cloud
    
*   A medical scan visualization
    

The voxels don't change. The rendering algorithm does.

If you remember nothing else: **voxel = 3D pixel = a cell in a 3D grid storing some data**.