Bézier curve 2026-10-14
A Bézier curve is a parametric curve specified by control points in a Euclidean space and the Bernstein basis:
Here is a binomial coefficient. Each coordinate is a polynomial of polynomial degree at most ; special choices of control points can lower the polynomial degree. The ordered control points form the control polygon. A cubic Bézier curve uses four control points and has the explicit form
The curve passes through and ; the interior control points steer its shape and need not lie on it.[ref]
For a worked example, choose
Substituting these control points gives
Here , so neither interior control point, both at height , lies on the curve. De Casteljau's algorithm computes the same point using only successive linear interpolations.
The endpoint tangent vectors follow from the Bézier derivative control polygon:
Thus the curve leaves toward and arrives at from . These nonzero derivatives determine the endpoint tangent lines; if an endpoint derivative vanishes, that formula alone does not determine its tangent direction. Endpoint handles are useful when arranging a parametric first-derivative join of Bézier curves.
The parameter is usually not arc length. For this example,
Equal steps in therefore do not generally travel equal distances. Distance along the curve is instead the arc length, given by the integral ; its derivative is the norm of the tangent vector and measures the rate of travel.
Two geometric facts make Bézier curves especially convenient for design. First, the Bernstein basis weights are nonnegative and form a partition of unity, since the binomial theorem gives . Hence is a convex combination of the control points and lies in their convex hull.[ref] The convex hull is the smallest convex set containing the control points, not their axis-aligned bounding box. Here it is a trapezoid, strictly smaller than : the box corner is outside the convex hull. The curve need not fill or touch every edge of either enclosure. The convex hull guarantee concerns ; outside that interval weights can be negative.
Second, applying an affine map to every control point gives exactly the same result as applying it to the entire curve. For ,
This is affine equivariance of a geometric basis: a translation, rotation or shear mapping can be performed on a handful of control points. For example, transforms the four control points to and transforms the midpoint to , also obtained from the same weights .
These editable handles explain the usefulness of Bézier curves in computer aided geometric design, vector graphics paths and outline fonts: a small collection of points controls an entire smooth stroke, and resizing the design preserves its mathematical shape. Cambridge's computer-graphics notes describe their use in graphic design, typography and PostScript outlines. The industrial context includes Pierre Bézier's work at Renault and Paul de Casteljau's work at Citroën.[ref]
// Target: analysis.bigb
Chaikin subdivision 2026-10-14
Chaikin subdivision generates a rounded subdivision curve by repeatedly cutting the corners off a control polygon. Each edge contributes two new control points, one a quarter of the way along the edge and the other three quarters of the way along it. Connecting these new control points in edge order replaces the old corners by shorter line segments. This makes Chaikin subdivision a useful way to draw a smooth outline from a small, editable set of control points, without evaluating B-spline basis functions at each drawing step. Joy presents both the corner-cutting rule and its closed version.[ref]
For a closed control polygon with control points , set and interpret indices cyclically. One refinement gives
and the new control polygon is the ordered sequence
Close it by joining back to . Use the old control points for every average in the same refinement; updating them in place would define a different algorithm. One refinement produces stored control points, and refinements produce , counting entries even if some coordinates coincide. Open control polygons need an explicit endpoint convention: applying only the interior edge rule discards the original endpoints, whereas retaining endpoints changes the boundary rule. The closed analysis below uses cyclic indices throughout.
For a worked example, start with the rectangular control polygon
The first edge gives and . Applying Chaikin subdivision to all four edges, including the closing edge, gives exactly eight control points in this order:
Thus the rectangle becomes an octagonal control polygon. Two refinements have control points, and five have . The illustration shows finite control polygons at stages ; the last is already visually rounded but still consists of line segments.
Figure 1.
Chaikin corner cutting on a rectangle at iterations zero, one, two and five
. The dashed rectangle is the original control polygon and its convex hull. Blue line segments and dots show the current control polygon and control points; no panel claims to be the exact limiting curve. Details.
The convex hull property follows directly from the weights. Each new control point is a convex combination of the endpoints of one old edge, because the weights are nonnegative and sum to one. Consequently, if is the convex hull of the stage- control points, then . Every later line segment, and every limit point, stays in the original convex hull. This gives a useful geometric enclosure. It also explains why Chaikin subdivision is approximating rather than an interpolation rule: the rectangle's four original corners are outside the first octagon's convex hull, so the limiting curve cannot pass through them. A refinement control polygon generally lies off the limiting curve as well.
For the cyclic uniform rule, the closed limit is the periodic quadratic uniform B-spline curve determined by the original control points. Uniform refers to equal spacing in the spline knot sequence, not equal physical lengths of edges of the control polygon. An infinite uniform control sequence has the corresponding local description; arbitrary open endpoint conventions need separate treatment. Joy derives the quarter-point refinement by splitting quadratic uniform B-spline spans.[ref]
Here is an explicit description of that closed limit, with cyclic indices and a unit parameter span for each original control point:
Each coordinate is a quadratic polynomial, and the three coefficients form a nonnegative partition of unity. The span runs from to . Differentiating gives and , so adjacent spans have matching values and matching first derivatives. Their second derivatives generally differ. Thus the parameterized curve is , generally not ; degenerate control points can still make its tangent vector vanish. For the rectangle, the span around is
which rounds the original corner between edge midpoints and . For equally spaced abscissae, the centered Chaikin basis function gives the scalar graph version of this quadratic B-spline representation and has support of width three original grid intervals.
Another useful property is affine equivariance of a geometric basis: refining and applying an affine map commute. For ,
and the same calculation holds for . The sum-to-one weights account for the translation. Therefore at every refinement, and also for the limit. A designer can apply a shear mapping, translation, or other affine map to the original control polygon and obtain exactly the transformed outline.
For example, compose the shear mapping with the translation to obtain . The rectangle's control points become . On its right edge, cutting first gives and then . Transforming first and cutting instead gives , the same control point.
Figure 2.
Shearing and translating a control polygon commutes with one Chaikin refinement
. Left: the rectangle and its first refinement. Right: the transformed control polygon, with blue dots from cutting after the affine map and orange rings from applying the affine map after cutting. All eight pairs coincide. Details.
Historically, George M. Chaikin published “An algorithm for high-speed curve generation” in Computer Graphics and Image Processing 3(4), December 1974, pages 346–349. Its emphasis was practical curve generation through a recursive algorithm using simple arithmetic, with applications including machine control and three-dimensional curves. The lasting appeal of Chaikin subdivision is how an elementary local average creates an entire smooth B-spline curve.[ref]
For a parametric curve represented by fixed scalar functions and control points in Euclidean space, write
The influence function of this handle is : the resulting displacement vector is , and its norm is . These are exact finite changes, not only a first-order estimate. Where is negative the displacement points opposite to . Where , the curve is unchanged at that parameter.
Figure 1.
The influence coefficient 3t(1-t)^2 equals the vertical displacement for a unit upward move of P1, reaches 4/9 at t=1/3, and vanishes at both endpoints
. Details.
For the cubic Bézier curve above, the Bernstein basis influence function is . Its derivative is
It increases up to and decreases thereafter on . Consequently the largest displacement at corresponding parameters is
For it is . This is a comparison at the same parameter. A geometric closest-distance comparison, as in a closest-point search on a subdivision curve, instead minimizes over another parameter:
The closest parameter can differ from , so is not automatically a maximum closest-distance separation of the two curves. Neither parameter is assumed to be arc length.
The support of a function is the closure of the parameter values where . It bounds where a nonzero handle move can act, but may include boundary points where the actual displacement is zero. Here the support of a function is all of relative to the parameter domain, while the endpoints are unaffected. In contrast, a B-spline of order has support within in its spline knot sequence, so its handle affects only that parameter range; the support and Gram bandwidth of B-splines describes the same locality in another application. Changing the spline knots or the basis along with the handle requires a different comparison.
When the basis functions form a partition of unity, , each evaluation is an affine combination of the control points. Applying an affine map to all handles gives
This is affine equivariance of a geometric basis, also called affine covariance: affine maps preserve affine combinations. In particular, translating every handle by translates the whole curve by , whereas moving just one handle produces . The Bernstein basis has this partition of unity property.[ref] Nonnegative weights further make evaluations convex combinations, giving the convex hull bound illustrated by the control polygon; nonnegativity is not needed for affine covariance.
For a proof outline of the influence formula, subtract the two basis representations: every unchanged coefficient cancels, leaving . The same subtraction with several moved handles gives . No claim about interpolation, closest-point search on a subdivision curve or endpoint motion follows until the actual basis values are examined.
Three useful geometric properties, with their concrete consequences here, are:
These give the compact answer
The same sum-to-one calculation also explains affine equivariance of a geometric basis: applying an affine map to the handles applies that map to the curve.
A solid body transform is a rigid transformation: it preserves distances within the object. In three-dimensional coordinates it has the form , with translation and an orthogonal matrix . For a proper physical rotation, the coefficient constraints are
Equivalently the columns of are an orthonormal basis with positive orientation. A reflection also preserves distance but has and is excluded when “solid-body motion” means a rotation and translation. There are three rotational and three translational degrees of freedom, not twelve independent matrix coefficients.
Computationally use the homogeneous coordinates representation
The last row is ; matrix multiplication composes transforms. Alternatively store a unit quaternion together with , maintaining its unit norm. A transpose gives the rotational inverse: .
Write the cubic Bézier curve as , where . The binomial theorem gives . Transforming the controls produces
This proves pointwise equivariance, including the original parameter values; it is stronger than a statement that the two curves merely have the same shape.
Orthogonality was not used in the calculation. The identical proof applies to every affine map , including scales, shears and even singular affine maps. It applies to every representation with scalar, control-independent partition of unity basis functions: Bézier curves of every degree, B-splines, surfaces built on a tensor-product surface basis, triangular Bézier patches, and more general linear control-point representations. Positivity is not needed for affine equivariance of a geometric basis. For linear stationary subdivision matrices with row sums one, each refinement step commutes with the affine transformation; taking a convergent limit proves the corresponding assertion for subdivision curves and subdivision surfaces. Rules with geometry-dependent nonlinear weights require separate equivariance tests and are not covered automatically.
The affine class is the largest class that preserves every such Euclidean-control construction with unchanged basis weights, under the usual continuity assumption. In fact the degree-one case would force
for all and . This segment identity, followed by continuity, forces to be affine. Nonlinear transforms such as perspective division generally fail it.
There is a further extension when the representation itself is enlarged: apply a projective transformation linearly to homogeneous controls , then dehomogenize the weighted sum. The transformed objects are rational Bézier curves or non-uniform rational B-splines, with transformed weights as well as transformed Euclidean controls. This works wherever the new denominator is nonzero. It does not assert projective invariance of ordinary polynomial Bézier curves with their old weights.
A tensor-product surface basis is formed from two independent univariate basis families and on separate parameter intervals. Given a rectangular control net , its parametric surface is
The parameters and indices vary independently over a product domain. The representation can be evaluated first in either parameter, giving a convenient computational advantage. Assume a finite basis, or locally finite spline bases, so differentiation and summation below are justified locally.
For positivity, if each factor basis is nonnegative, then . If both factors are strictly positive at a point, their product is strictly positive there. Nonnegative weights are the usual geometric meaning of positivity; zero boundary weights are allowed. With partition of unity, this gives the local convex hull enclosure of the active control points.
For continuity, suppose the first family is and the second , including matching derivatives across their respective spline knots. On every polynomial piece, and by matching at the knot lines,
Every factor on the right is continuous in its own variable, so its product is jointly continuous. Thus all these mixed derivatives are continuous, in particular the surface is jointly . The separate coordinate smoothness can be better: orders in and in . For piecewise polynomials of degrees , an interior knot of multiplicity in the first factor normally gives matching in , inherited along that knot line; similarly for . The statement is an inherited lower bound. Special control points can cancel derivative jumps, so a particular surface may be smoother than a generic member of its basis.
For summation to unity, independent summation factors exactly:
This also explains why translations of all control points translate the surface by the same vector, as in affine equivariance of a geometric basis. These three arguments establish tensor-product inheritance of geometric basis properties directly from the factor identities.
A triangular Bézier patch is a non-tensor-product example. For barycentric parameters with , a quadratic patch is
The six basis functions have total degree two and sum to . Their index constraint and triangular parameter domain do not arise from two independently indexed univariate factors on a rectangle. An individual triangular polynomial could be embedded in another larger representation, but this triangular basis and control net are not a tensor-product surface definition.
Vector graphics 2026-10-13
Vector graphics represent a picture by geometric objects and instructions for drawing them: positions, shapes, fills, boundary strokes and transformations. A circle can be stored as a centre and radius; a rectangle as a corner, width and height; a polygon as an ordered list of vertices. These geometric primitives describe whole objects rather than assigning a colour to every pixel. SVG provides elements for such basic shapes and for paths assembled from line segments and curves.[ref]
The useful separation is between the stored geometry and the finite output. A circle of radius 2 remains the same geometric description whether rendered across twenty or two thousand output pixels. This is the sense in which vector graphics are resolution independent: increasing the output grid can evaluate the original geometry again. The resulting raster image still has finite spatial resolution, and numerical coordinates have finite precision. Enlarging a previously rendered raster image through interpolation instead works with its existing samples. Neither operation guarantees that arbitrarily thin details remain visible at every size.
An SVG path uses a current point and drawing commands. For example, M 1 4 L 5 4 L 3 1 Z moves to , draws two line segments, then closes back to the starting point, giving a triangle. Uppercase commands use absolute coordinates; the corresponding lowercase commands use offsets from the current point. Thus M 1 4 l 4 0 l -2 -3 z describes the same triangle. The coordinates belong to the current user Cartesian coordinate system, not necessarily to output pixels.[ref]
For a curved example, the path M 1 4 Q 3 0 5 4 Z uses one quadratic Bézier curve followed by a closing line segment. With control points , and , its curved boundary is
The endpoints are , and ; the interior control point is not a point on the curve. A fill paints the enclosed region, while a stroke paints a band around its boundary with a chosen width. One can use either or both: geometry and paint instructions are distinct.[ref][ref]
Figure 1.
Analytical path illustration: a quadratic Bézier boundary and its affine image
. Details.
The first illustration uses increasing downward, following the initial SVG coordinate convention. Its dashed control polygon guides the eye; it is not part of the filled path. Apply the affine map
This combines horizontal scaling, a shear mapping and a translation. The transformed control points are , and , giving the path M 4.5 5 Q 5.5 1 10.5 5 Z. Its curved midpoint is . The affine equivariance of a geometric basis explains why transforming only the control points transforms the entire Bézier curve: its weights sum to one, so the translation is added exactly once. The enclosed area is before transformation and afterwards. These checks concern the filled region, excluding the width of any stroke.
An SVG viewBox specifies a rectangle in user coordinates to map into a display region. For example, viewBox="0 0 6 6" in a square viewport of 120 by 120 display units gives a scale of 20 display units per user unit; in a square viewport of 600 by 600 it gives 100. The path's control points need not change. For unequal proportions, preserveAspectRatio controls whether the mapping preserves proportions or stretches the axes separately. These display units need not correspond one for one to physical display pixels.[ref][ref]
Rasterization converts the geometric drawing into a raster image on a chosen grid. Deciding whether each pixel centre lies inside a filled region is a simple rule, but a moving diagonal boundary can make entire pixels switch abruptly. Antialiasing reduces these sampling artifacts by accounting for a footprint around each sample, rather than treating every pixel as a single inside-or-outside decision. This connects vector graphics to raster sampling and reconstruction and aliasing; a finer grid and a better sampling rule solve different parts of the problem.
For an exact analytical model, fill the region . For a square pixel footprint , let
Here is geometric coverage, and is relative luminance for ideal opaque neutral shades, with and . The intersection and area determine how much of the footprint is covered. This is a specified area-average model, not a claim that every SVG renderer uses exact coverage. The SVG shape-rendering property supplies rendering hints and permits implementation tradeoffs, including disabling antialiasing for some choices.[ref]
Figure 2.
Analytical rasterization model: pixel-centre decisions versus exact coverage on two grids
. Details.
On the grid of unit squares, has coverage , whereas the pixel centre lies inside and gives coverage 1 under the centre rule. The adjacent square has coverage but its centre lies outside. The entire filled area is . Summing exact coverage times cell area gives this value on both the and grids; the coarse centre rule instead gives 10. Coverage values are displayed after sRGB encoding of the modeled relative luminance. The thin coloured line is a geometry overlay, not an extra sampled stroke. Enlarging the middle panel by nearest-neighbor interpolation would repeat its sixteen values; re-rendering the geometry produces the 256 independently evaluated footprints in the right panel. Antialiasing reduces abrupt edges but cannot make a finite grid preserve every geometric detail.
The attractive feature of vector graphics is editability at the level of intent: move one control point to bend a boundary, change a circle's radius, or transform a whole diagram while keeping its parts aligned. Logos, technical diagrams and outline fonts benefit because their structure can be expressed with relatively few shapes and curves. A complicated photograph may require enormous geometric detail, so vector graphics do not imply a smaller file than raster graphics. Nor does an SVG container guarantee that every object is vector geometry: its image element can embed or reference a PNG raster image. Transforming that embedded raster image changes its placement and reconstruction, but does not recover missing original detail.[ref]