🦖 Bellaziraptor

Interactive labs

Vectors in 3D

Two vectors you can push around in space. Drag their tips, type their components, or set them spinning, and watch the dot product, the cross product, the sum and the difference respond live. The second bench looks straight down the z-axis to show what “into the page” and “out of the page” actually mean. Everything runs in your browser — nothing is recorded and nothing is sent anywhere.

Two vectors in space

A and B start at the origin. Drag the view to orbit it, drag an arrowhead to move that vector in the plane of the screen, or use the sliders for exact components. The graph on the right shows how the two products would change if only the angle between them changed.

A B A + B A − B A × B projection of A on B

Drag empty space to orbit. Drag an arrowhead to move that vector. ⊙ means a vector pointing straight at you, ⊗ straight away.

A·B = |A||B| cos θ and |A×B| = |A||B| sin θ against θ. The solid dot is where you are; the hollow one is the other angle with the same sine.

Show

Vector A

Ax
Ay
Az

Vector B

Bx
By
Bz
Presets
Motion
Speed 40 °/s
Zoom 1.00×
|A|
|B|
θ between
θ in radians
A · B
cos θ
θ from arccos
A along B
A × B
|A × B|
sin θ
θ from arcsin
A + B
|A + B|
A − B
|A − B|
Why arccos is safe and arcsin is not

Between two vectors θ runs from 0° to 180°. Cosine is different for every angle in that range, so A·B pins θ down uniquely. Sine is not: sin 60° = sin 120°, so |A×B| alone can only tell you “60° or 120°”. Look at the hollow dot on the graph — it never goes away. The sign of the dot product breaks the tie: positive means the acute answer, negative means the obtuse one.

Things worth trying
  • Pick Perpendicular. A·B reads exactly 0, the projection collapses to a point, and |A×B| is as big as it can be for those lengths — |A||B|.
  • Pick Parallel, then Antiparallel. The cross product vanishes both times; only the sign of the dot product tells them apart.
  • Choose Sweep θ and press Play. The cross product stays on one axis the whole time, growing and shrinking, and flips to the opposite side the instant B passes through A’s line.
  • Choose Spin B about A. The angle and the dot product freeze, the projection freezes, and A×B sweeps out a circle — everything about the cross product is direction.
  • Switch to the Top-down view with the Flat preset. A×B turns into a ⊙ symbol: it points straight at you, out of the page.
  • Turn on A − B and drag things around. The difference always runs from the tip of B to the tip of A — that is the arrow you would add to B to reach A.

Into and out of the page

The same A and B, now seen from directly above the xy-plane — this is the “page” in every textbook diagram, with z pointing at your face. Only the x and y components matter here, so the cross product is purely along z: AxByAyBx. Positive means out of the page toward you (⊙); negative means into the page (⊗). Flip the viewpoint and both the symbol and the rotation sense reverse — they are the same physical fact seen from the other side.

Viewed from

Drag the arrowheads. Only x and y change here — z is left alone.

(A × B)z
Rotation A → B
A × B points
θ in the plane
Right-hand rule

Point the fingers of your right hand along A, curl them toward B through the smaller angle, and your thumb gives A×B. Counterclockwise curl (seen from above) → thumb up → +z → out of the page. Clockwise → thumb down → −z → into the page. Swap the order and B×A is the same length pointing the other way.

Things worth trying
  • Drag B across the line of A. The instant it crosses, the arc flips direction and the symbol flips from ⊙ to ⊗ — the cross product has no “small” way to change sign.
  • Switch to Below. The arc that read counterclockwise now reads clockwise, and the symbol flips — but (A×B)z in the readout does not change. Into/out of the page is about where you are standing; the vector never moved.
  • Make the two vectors collinear. The arc disappears and (A×B)z reads 0 — no rotation means no cross product.

Formula sheet

Everything the readouts above are computing, in one place.

\[ \vec A + \vec B = (A_x + B_x,\; A_y + B_y,\; A_z + B_z) \qquad \vec A - \vec B = (A_x - B_x,\; A_y - B_y,\; A_z - B_z) \] Componentwise. Geometrically, put the tail of \(\vec B\) on the tip of \(\vec A\) for the sum; \(\vec A - \vec B\) runs from the tip of \(\vec B\) to the tip of \(\vec A\).
\[ \vec A \cdot \vec B = A_xB_x + A_yB_y + A_zB_z = |\vec A|\,|\vec B|\cos\theta \] \[ \theta = \arccos\frac{\vec A\cdot\vec B}{|\vec A|\,|\vec B|} \qquad \text{scalar projection of } \vec A \text{ on } \vec B = \frac{\vec A\cdot\vec B}{|\vec B|} \] A scalar. Positive when the angle is acute, zero when perpendicular, negative when obtuse. Because \(\cos\) is one-to-one on \([0^\circ, 180^\circ]\), arccos returns the angle without ambiguity.
\[ \vec A \times \vec B = \begin{vmatrix} \hat\imath & \hat\jmath & \hat k \\ A_x & A_y & A_z \\ B_x & B_y & B_z \end{vmatrix} = (A_yB_z - A_zB_y)\,\hat\imath + (A_zB_x - A_xB_z)\,\hat\jmath + (A_xB_y - A_yB_x)\,\hat k \] \[ |\vec A \times \vec B| = |\vec A|\,|\vec B|\sin\theta \qquad \theta = \arcsin\frac{|\vec A\times\vec B|}{|\vec A|\,|\vec B|}\;\;\text{(returns only } 0^\circ\text{–}90^\circ) \] A vector, perpendicular to both inputs, direction from the right-hand rule, and anticommutative: \(\vec B\times\vec A = -\,\vec A\times\vec B\). Its magnitude is the area of the parallelogram the two vectors span. Since \(\sin\theta = \sin(180^\circ-\theta)\), the arcsin route needs the sign of the dot product to decide between the two.
\[ \text{For } \vec A, \vec B \text{ in the } xy\text{-plane:}\qquad \vec A\times\vec B = (A_xB_y - A_yB_x)\,\hat k \] Positive \(\Rightarrow\) \(+z\), out of the page, \(\vec A\to\vec B\) counterclockwise (viewed from \(+z\)). Negative \(\Rightarrow\) \(-z\), into the page, clockwise.