Vectors: The Mathematical Language of 3D Graphics
A 3D game might track millions of vectors every frame: where each vertex is, which way each surface faces, where the light is coming from, how fast the player is moving, and where the camera is looking.
Remarkably, nearly all of that work uses just five or six operations. Learn them, and you can read the math behind lighting, reflections, collisions and cameras in almost any 3D engine.
A Point and a Direction Are Different Things, Even With the Same Numbers
The triple (3, 4, 0) might describe a position ("the lamp is here") or a direction and distance ("move this far this way"). Mathematically they look identical. In graphics, mixing them up causes real bugs.
- Moving a scene should shift positions, but a direction like "up" shouldn't change when you move.
- Subtracting two positions gives a direction. Adding two positions is usually meaningless.
That's why 3D engines often store positions as (x, y, z, 1) and directions as (x, y, z, 0). When a translation matrix is applied, the 1 lets positions move while the 0 keeps directions unchanged.
Operation 1: Addition and Subtraction
Add vectors component by component:
(1, 2, 3) + (4, 5, 6) = (5, 7, 9)
Graphics use: moving an object. New position = old position + velocity × time.
Subtraction gives the vector from one point to another:
target − player = direction to target
Operation 2: Scaling
Multiply every component by a number:
2 × (1, 2, 3) = (2, 4, 6)
Graphics use: changing speed, fading light, or reversing direction with −1.
Operation 3: Length and Normalization
The length (or magnitude) of a vector comes from the Pythagorean theorem in 3D:
|v| = √(x² + y² + z²)
|(3, 4, 12)| = √(9 + 16 + 144) = √169 = 13
A unit vector has length 1. To normalize a vector, divide by its length:
(3, 4, 12) / 13 ≈ (0.231, 0.308, 0.923)
Graphics use: lighting and reflection formulas need pure directions, so vectors are normalized first. Check square roots with the square roots list.
Operation 4: The Dot Product
a · b = aₓbₓ + a_yb_y + a_zb_z = |a| |b| cos θ
(1, 2, 3) · (4, 5, 6) = 4 + 10 + 18 = 32
For unit vectors, the dot product is the cosine of the angle between them. That single number answers several questions:
- Lighting: brightness of a matte surface = max(0, N · L), where N is the surface normal and L points to the light (Lambert's cosine law)
- Facing: if the dot product is negative, a surface faces away, so it can be skipped (backface culling)
- Field of view: is an enemy within 45° of where I'm looking? Check forward · direction ≥ cos 45° ≈ 0.707
Explore cosines with the cosine calculator and recover angles with the arc cosine calculator.
Operation 5: The Cross Product
a × b = (a_yb_z − a_zb_y, a_zbₓ − aₓb_z, aₓb_y − a_ybₓ)
(1, 2, 3) × (4, 5, 6) = (−3, 6, −3)
The result is perpendicular to both inputs. Its length is |a| |b| sin θ, the area of the parallelogram the two vectors span.
Graphics use: finding a triangle's surface normal. For corners P₀, P₁, P₂:
N = (P₁ − P₀) × (P₂ − P₀)
The order of the corners decides which way N points, using the right-hand rule. That's why 3D models carefully store triangle vertices in a consistent winding order.
Operation 6: Reflection
When a ray with direction D hits a surface with unit normal N, the reflected direction is:
R = D − 2(D · N)N
For a ball moving down-right, D = (1, −1, 0), bouncing off a floor with N = (0, 1, 0):
D · N = −1
R = (1, −1, 0) − 2(−1)(0, 1, 0) = (1, 1, 0)
The ball keeps its sideways motion and bounces upward. The same formula drives mirror reflections, specular highlights and billiard-ball physics.
An Insider Reference: Gibbs, Heaviside and the Vector Wars
Vectors as we use them are younger than you might think. William Rowan Hamilton coined the word "vector" in the 1840s as part of his quaternions, a four-dimensional number system.
In the 1880s, American physicist Josiah Willard Gibbs and English engineer Oliver Heaviside independently stripped quaternions down to what physicists actually needed: separate dot and cross products on three-component vectors. Gibbs circulated his Elements of Vector Analysis privately to students starting in 1881.
Quaternion supporters were furious, and a sharp debate played out in scientific journals through the 1890s. Vectors won because they made Maxwell's equations of electromagnetism far easier to write. A century later, graphics programmers use Gibbs's dot and cross products for lighting and geometry, and Hamilton's quaternions for smooth rotations. Both sides won, in a way.
Two Concepts Worth Knowing
Normal Vector
A normal vector is perpendicular to a surface. Lighting, collision response and backface culling all depend on knowing surface normals.
Projection
The projection of vector a onto unit vector u is (a · u)u, the part of a pointing along u. It's used to slide characters along walls: remove the part of the movement that points into the wall.
Quick Answer: How Are Vectors Used in 3D Graphics?
3D graphics uses vectors for positions, directions, velocities and surface normals. Addition moves objects, normalization produces directions, the dot product computes lighting and angles, the cross product finds surface normals, and the reflection formula R = D − 2(D·N)N handles bounces and mirrors.
Try Them Yourself
- Cosine Calculator: the heart of the dot product
- Arc Cosine Calculator: angles between vectors
- Right Triangle Calculator: vector lengths in 2D
- Analytic Geometry Formulas: distance and direction formulas
- Matrix Multiplication Calculator: transform many vectors at once
- The Mathematics Behind Computer Graphics: the full rendering pipeline
Pick three points of a triangle, compute its normal with the cross product, and normalize it. Then dot it with a light direction like (0, 1, 0). You've just lit your first surface by hand.