Deriving the formula from a determinant
That component formula looks like something you would have to memorize. You don't — it is
just the
determinant
of a symbolic 3\times 3 matrix whose first row is the standard
basis vectors \hat{\imath}, \hat{\jmath}, \hat{k}.
Step 1 — write the mnemonic determinant. Put the basis vectors on top, the
components of \vec{a} in the middle row, and the components of
\vec{b} on the bottom:
\vec{a} \times \vec{b} \;=\; \begin{vmatrix} \hat{\imath} & \hat{\jmath} & \hat{k} \\ a_1 & a_2 & a_3 \\ b_1 & b_2 & b_3 \end{vmatrix}.
Step 2 — expand along the top row. Cofactor expansion gives each basis
vector its 2\times 2 minor (and the alternating sign on
\hat{\jmath}):
= \hat{\imath} \begin{vmatrix} a_2 & a_3 \\ b_2 & b_3 \end{vmatrix} - \hat{\jmath} \begin{vmatrix} a_1 & a_3 \\ b_1 & b_3 \end{vmatrix} + \hat{k} \begin{vmatrix} a_1 & a_2 \\ b_1 & b_2 \end{vmatrix}.
Step 3 — evaluate each 2\times 2 determinant.
Each is just "down-product minus up-product":
= \hat{\imath}\,(a_2 b_3 - a_3 b_2) \;-\; \hat{\jmath}\,(a_1 b_3 - a_3 b_1) \;+\; \hat{k}\,(a_1 b_2 - a_2 b_1).
Step 4 — read off the components. The middle sign flips the bracket, giving
the symmetric pattern (note the index cycle 1\to 2\to 3\to 1):
\vec{a} \times \vec{b} = \big(\, a_2 b_3 - a_3 b_2,\;\; a_3 b_1 - a_1 b_3,\;\; a_1 b_2 - a_2 b_1 \,\big).
Why it's perpendicular, and how long it is
Two claims make the cross product useful. Both fall out by direct computation.
Step 5 — check perpendicularity. Dot the result with
\vec{a} and watch everything cancel in pairs:
\vec{a} \cdot (\vec{a} \times \vec{b}) = a_1(a_2 b_3 - a_3 b_2) + a_2(a_3 b_1 - a_1 b_3) + a_3(a_1 b_2 - a_2 b_1).
= a_1 a_2 b_3 - a_1 a_3 b_2 + a_2 a_3 b_1 - a_1 a_2 b_3 + a_1 a_3 b_2 - a_2 a_3 b_1 = 0.
Every term meets its negative, so the sum is 0. Since a zero dot
product means a right angle, \vec{a} \times \vec{b} \perp \vec{a}
— and by the identical computation it is perpendicular to
\vec{b} too.
Step 6 — find its length. Grinding out
\lVert \vec{a} \times \vec{b}\rVert^2 and using
\lVert\vec{a}\rVert^2 \lVert\vec{b}\rVert^2 = (\vec{a}\cdot\vec{b})^2 + \lVert\vec{a}\times\vec{b}\rVert^2
with \vec{a}\cdot\vec{b} = \lVert\vec{a}\rVert\lVert\vec{b}\rVert\cos\theta
gives
\lVert \vec{a} \times \vec{b} \rVert = \lVert\vec{a}\rVert\,\lVert\vec{b}\rVert\,\sin\theta.
That is exactly the area of the parallelogram spanned by the two vectors
(base \lVert\vec{a}\rVert times height
\lVert\vec{b}\rVert\sin\theta) — see the
magnitude
for the length notation.
Step 7 — orientation is signed, so order matters. Swapping the rows of the
determinant flips its sign, so the cross product is anticommutative:
\vec{a} \times \vec{b} = -\,(\vec{b} \times \vec{a}).
Both results have the same length, but they point in opposite directions. Which one
you get is fixed by the right-hand rule: point your fingers along
\vec{a}, curl them toward \vec{b}, and
your thumb points along \vec{a}\times\vec{b}.
For \vec{a}, \vec{b} \in \mathbb{R}^3 with angle
\theta between them, the cross product
\vec{a}\times\vec{b} is the vector satisfying:
-
Perpendicularity —
\vec{a}\cdot(\vec{a}\times\vec{b}) = \vec{b}\cdot(\vec{a}\times\vec{b}) = 0,
so it is orthogonal to both \vec{a} and
\vec{b}.
-
Length = area —
\lVert\vec{a}\times\vec{b}\rVert = \lVert\vec{a}\rVert\,\lVert\vec{b}\rVert\,\sin\theta,
the area of the parallelogram they span.
-
Direction — fixed by the right-hand rule (the unique perpendicular for
which \vec{a}, \vec{b}, \vec{a}\times\vec{b} form a
right-handed frame).
-
Anticommutative —
\vec{a}\times\vec{b} = -(\vec{b}\times\vec{a}); in particular
\vec{a}\times\vec{a} = \vec{0}.
Every lit triangle on every screen owes its brightness to a cross product. Given a triangle
with corners \vec{a}, \vec{b}, \vec{c}, two of its edges are
\vec{b}-\vec{a} and \vec{c}-\vec{a}.
Their cross product is perpendicular to the whole triangle — a surface
normal:
\vec{n} = (\vec{b}-\vec{a}) \times (\vec{c}-\vec{a}).
Normalising it to unit length gives the direction the surface "faces":
\hat{n} = \frac{\vec{n}}{\lVert \vec{n} \rVert}.
A renderer dots \hat{n} with the direction to a light source to
decide how bright the triangle is — a face turned toward the light glows, a face turned away
goes dark. The same \hat{n} tells the engine which way is "out"
for backface culling and collision response. One cross product, a million times a frame.