Bézier Curves and Their Control Points

Bézier curves are parametric curves widely used in computer graphics, animation, and font design. A Bézier curve is defined by a set of control points $P0,P1,\dots ,Pn$. The curve begins at $P0$ and ends at $Pn$. Intermediate control points shape the curve without necessarily lying on it. The most familiar form is the cubic Bézier with four control points, ubiquitous in vector graphics software. The general formula uses Bernstein polynomials:

$B\left(t\right)=\sum _i^{=}Pi{B}_i^n\left(t\right)$ where $B_i^n\left(t\right)=\frac{n!}{i!n-i!}{t}^i{1-t}^{n-i}$.

The parameter $t$ runs from 0 to 1. At $t=0$, the curve equals $P0$; at $t=1$, it equals $Pn$. The intermediate points are blended according to the weights given by the Bernstein polynomials.

De Casteljau's Algorithm

Although the Bernstein polynomial formula is precise, Bézier curves are often evaluated using De Casteljau's algorithm. This method repeatedly linearly interpolates between consecutive control points. Given points $P0,P1,\dots ,Pn$, we compute new points

$P^{(1)}i=\left(1-t\right)Pi+\left(t\right)Pi+1$

for $i=0,\dots ,n-1$. Repeating this interpolation $n$ times yields a single point $P^{(n)}0$, which is the value of the Bézier curve at parameter $t$. De Casteljau's algorithm is numerically stable and provides an intuitive geometric interpretation: the curve lies within the convex hull of its control points.

Understanding the Geometry

Bézier curves are widely used because they offer smooth control over shape. The polygon formed by the control points is known as the control polygon. As you adjust these points, the curve bends toward them but never crosses certain lines called the “variation diminishing property.” By manipulating a small number of points, designers can create complex shapes. De Casteljau's algorithm visually demonstrates how the curve emerges from progressive interpolation.

Working Through an Example

Consider a quadratic Bézier curve with three control points $P0=(0,0)$, $P1=(1,2)$, and $P2=(2,0)$. At $t=0.5$, De Casteljau's algorithm gives the intermediate points

$P^{(1)}0=\left(0.5\right)\left(0,0\right)+\left(0.5\right)\left(1,2\right)=(0.5,1)$

and

$P^{(1)}1=\left(0.5\right)\left(1,2\right)+\left(0.5\right)\left(2,0\right)=(1.5,1)$

A second interpolation between these gives $P^{(2)}0=\left(0.5\right)(0.5,1)+\left(0.5\right)(1.5,1)=(1,1)$. Thus the point on the curve halfway along is (1,1).

Algorithm in the Calculator

The calculator reads a list of control points, one per line, each as x,y. It also reads a parameter value $t$ between 0 and 1. The script implements De Casteljau's algorithm generically: while there is more than one point in the list, it replaces the list with a new one obtained by linearly interpolating between consecutive points by the factor $t$. When only a single point remains, that point is the value of the Bézier curve at $t$. The result is displayed as coordinate pairs.

Practical Uses of Bézier Curves

Bézier curves were popularized by French engineer Pierre Bézier in the 1960s for automotive design. Today, they underpin vector graphics formats like SVG and PostScript. In animation, they define motion paths and smoothing transitions. Typography uses them to describe the outlines of letters, enabling scalable fonts that look sharp at any size. The ability to specify complex shapes with only a few control points keeps file sizes small and editing intuitive.

Numerical Considerations

When computing Bézier curves, numeric precision can matter, especially for curves of high degree. De Casteljau's algorithm is stable but may still accumulate rounding errors if many control points are involved. In practice, cubic and quadratic Bézier curves are common because they provide enough flexibility for most design tasks while remaining simple to compute. This calculator focuses on curves with up to six control points for quick experimentation.

Exploring Further

Try entering different sets of control points and values of $t$. Observe how the point on the curve moves as $t$ varies from 0 to 1. You can also visualize the curve by sampling many values of $t$ and plotting the resulting points in a separate graphing tool. Consider how the curve approximates straight lines when control points line up, or how increasing the number of points lets you model more intricate shapes.

By understanding Bézier curves and De Casteljau's algorithm, you gain insight into the mathematics that powers modern digital design. This calculator offers a hands-on way to explore those ideas and see how simple interpolations build sophisticated curves.