TNB Curve Lab

Use a space curve as a moving coordinate system. Explore the Frenet frame, its three fundamental planes, and a second curve built directly from T, N, and B.

1 · Base curve

x(t)

y(t)

z(t)

min t

max t

Preset

Curve samples

Use sin cos tan sqrt abs exp log sinh cosh tanh and constants pi, e. Powers may use ^. Example: 2*cos(3*t).

2 · Moving Frenet frame

Tangent T

label

Normal N

label

Binormal B

label

Vector length 1.50

3 · Fundamental planes

Osculating plane

label

Normal plane

label

Rectifying plane

label

Plane style

Plane opacity 0.28

4 · Curvature & osculating circle

Osculating circle

label

Curvature calculation

show center show radius

κ = |r′ × r″| / |r′|³ and ρ = 1/κ

r′(t)

—

r″(t)

—

r′ × r″

—

|r′|

—

|r′ × r″|

—

κ = —
ρ = —

The center of curvature is C = r + ρN. The osculating circle lies in the osculating plane and has second-order contact with the curve at the current point.

5 · Acceleration components

Show tangential / normal acceleration decomposition

a = r″(t) = a_TT + a_NN

show total acceleration a labels

Acceleration vector scale 0.35

a_T = d|v|/dt = (r′ · r″)/|r′| a_N = κ|v|² = |r′ × r″|/|r′|

velocity r′(t)

—

acceleration r″(t)

—

speed |r′|

—

a_T

—

a_N

—

a = —

Try Circle: its parameterization has constant speed, so a_T = 0 and the acceleration is entirely normal. Try Line (accelerating): a_N = 0 and the acceleration is entirely tangential. On the constant-speed line, both components are 0.

6 · Second curve in the moving TNB frame

q(t) = r(t) + a(t)T(t) + b(t)N(t) + c(t)B(t)

Show second curve

a(t) · T

b(t) · N

c(t) · B

show offset spoke show moving point

The coefficient formulas can use t and s, where s is approximate arc length measured from min t. This makes uniform-distance spirals possible, e.g. 0.5*cos(4*s).

7 · Appearance & thickness

Base curve thickness 0.055

Second curve thickness 0.045

T / N / B vector thickness 0.045

Acceleration vector thickness 0.060

Osculating-circle thickness 0.035

Trail thickness 0.025

Thickness is rendered as actual 3D geometry, so it remains visible consistently across browsers and projectors.

8 · View, window & projection

Projection

Orthographic zoom

x window

y window

z window

clip objects to window show window box

axes ground grid follow moving point frame-point trail

Ride Curve switches to an elevated first-person perspective attached to the Frenet frame: forward = T and up = B. Drag to look around without changing your riding position; scroll in for a closer first-person view or scroll out to pull behind the moving TNB frame for a chase view. Frenet vectors become undefined where r′ is zero or where curvature vanishes; the app flags those points rather than inventing a frame.

© 2026 John Chase · Made with help from ChatGPT
Version 1.1 · Back to Teaching Apps
Version history

t

0.000

r(t)

(—)

speed |r′|

—

curvature κ

—

torsion τ

—

t =

Speed 1.0×

Drag to orbit · Shift + drag / right-drag to pan · Scroll or pinch to zoom · Base curve: Plot / Update · Second curve updates automatically

Share this construction

This link stores the curve, TNB construction settings, acceleration decomposition, thicknesses, custom window/projection, second curve, current t-value, theme, and camera view.

Copied