Bézier Curves: The Maths Behind Every Smooth Line

A curve built from a parameter, not a function

An ordinary function y = f(x) cannot describe a loop or a closed shape — it fails the vertical-line test. A parametric curve sidesteps the problem by expressing both x and y as functions of an independent parameter t running from 0 to 1: P(t) = (x(t), y(t)). At t = 0 the curve starts, at t = 1 it ends, and the values in between trace the path continuously. Invented independently in the 1960s by Paul de Casteljau at Citroën and Pierre Bézier at Renault — both trying to describe car body panels mathematically — the Bézier curve became the standard way to let a handful of intuitive control points define a smooth shape.

De Casteljau's algorithm

De Casteljau found a purely geometric way to evaluate the curve with no explicit polynomial at all. Given control points P₀…Pₙ, repeatedly interpolate each neighbouring pair at parameter t until a single point remains — that point lies on the curve. For a cubic curve (four control points) this takes three levels of interpolation:

Level 1:  Q0=(1-t)P0+tP1   Q1=(1-t)P1+tP2   Q2=(1-t)P2+tP3
Level 2:  R0=(1-t)Q0+tQ1   R1=(1-t)Q1+tQ2
Level 3:  B(t)=(1-t)R0+tR1

Because it uses only linear interpolations, the algorithm is numerically stable even for high-degree curves, unlike direct polynomial evaluation, which suffers cancellation errors as degree grows. It also gives subdivision for free: evaluating at t = 0.5 splits the curve into two half-sized Bézier curves reusing the intermediate points, which is exactly how renderers flatten curves into line segments — subdivide until a segment is within one pixel of its chord, then stop.

Bernstein polynomials and the explicit formula

The same curve can be written as a weighted sum of control points using Bernstein basis polynomials: B(t) = Σ C(n,i)·tⁱ·(1−t)ⁿ⁻ⁱ·Pᵢ. These weights sum to 1 for every t (partition of unity), so the curve is always a convex combination of its control points and therefore lies entirely inside their convex hull — a property renderers exploit for fast bounding-box rejection tests. The curve also passes exactly through P₀ and Pₙ, and reversing t traces the same shape backwards.

Why cubic curves are the workhorse

Cubic Béziers — exactly four control points — are used almost everywhere: SVG's C command, PostScript and TrueType/OpenType font outlines, PDF paths, and the CSS cubic-bezier() timing function all rely on them. The tangent at each end is fixed by the adjacent handle: B'(0) = 3(P₁−P₀) and B'(1) = 3(P₃−P₂), so designers drag P₁ and P₂ to steer the curve's entry and exit direction. In cubic-bezier(0.25, 0.1, 0.25, 1.0), the endpoints (0,0) and (1,1) are fixed, the x-axis is normalised time and the y-axis is animation progress — the shape of the curve is the easing function.

Splines: joining segments smoothly

A single high-degree Bézier curve is unwieldy — moving one control point reshapes the whole curve. The fix is to chain several cubic segments into a spline, enforcing continuity at each join: C⁰ means the segments merely share an endpoint (a possible corner); C¹ means tangent direction and speed match (no kink), achieved by keeping the handles either side of the join collinear and equidistant; C² also matches curvature, which is what makes a reflection on a car body or a font outline look genuinely smooth rather than merely connected. B-splines generalise this further by distributing control points over a knot vector via the Cox–de Boor recursion, and NURBS add a weight to each point so that circles and ellipses — impossible for a plain polynomial Bézier curve — become exactly representable. NURBS are the geometry standard behind CAD exchange formats such as STEP and IGES.

Where the maths actually gets used

TrueType fonts store glyph outlines as quadratic Béziers; PostScript and OpenType use cubics — a single letter can involve 10-30 segments, rasterised at sub-pixel resolution every time text is drawn on screen. Animation software stores keyframe motion as cubic splines in time, with the handles producing slow-in/slow-out easing; game engines use the equivalent Hermite form for camera paths and character motion along rails. In CAD, automotive panels and turbine blades are modelled as NURBS surfaces — tensor products of NURBS curves in two directions — with manufacturing tolerance controlled by curvature κ = |B′×B″|/|B′|³. Robot arms and autonomous vehicles plan smooth trajectories the same way: cubic or quintic splines through waypoints that minimise jerk, the third derivative of position, so joints and passengers are not subjected to sudden accelerations.

Frequently asked questions

Try it live

Drag the control points of Bézier Curves and watch de Casteljau's construction animate step by step, alongside a B-spline of the same degree for comparison. Everything runs client-side in your browser.