Bezier Curve Explorer

Explore Bezier curves interactively. Drag control points and see the de Casteljau construction.

Loading interactive simulation...

No middle control point is ever reached 🖖

Drag an interior control point far off and the curve leans that way but never arrives. The Bernstein weight of an interior point has a hard ceiling: on the cubic presets it is b₁,₃(t) = 3t(1βˆ’t)Β², which peaks at t = 1/3 at a value of only 4/9. The endpoints carry weight exactly 1 at t = 0 and t = 1, which is why the curve starts and finishes precisely on them. Raise the degree and interior influence shrinks further β€” on the degree-5 preset the ceilings are 0.410 and 0.346. That is why designers chain short cubics instead of fitting one high-degree curve: the more control points you add, the less any single one can do.

Corner cutting with repeated averages 🖖

Behind the smooth curve is one humble operation repeated over and over: the straight-line average of two points. The de Casteljau algorithm takes your control points, finds the point a fraction t of the way along each connecting segment, then repeats on those new points until a single point remains β€” that is B(t). Drag the slider and watch the whole scaffold collapse to one dot tracing the curve.

Named after the wrong inventor 🖖

The algorithm this tool animates was created by Paul de Casteljau at CitroΓ«n in 1959, three years before Pierre BΓ©zier published similar work at rival carmaker Renault. CitroΓ«n treated de Casteljau's research as a trade secret and kept it unpublished, so the curves took BΓ©zier's name instead. Both engineers were shaping sheet metal for cars β€” the mathematics of fonts and animation was born on the factory floor.

BÉZIER CURVES — WHAT THE CONTROL POINTS CAN, AND CANNOT, MAKE THE CURVE DO

Which BΓ©zier Case Are You Drawing?

How many control points you use decides which shapes are even reachable; where you put them decides which one you get. Three points can only ever trace a piece of a parabola β€” no S, no cusp, no loop, whatever you do with the middle one. Add a fourth and all three become possible, separated by boundaries sharp enough to compute. The three cubics below share P0, P1 and P2 and differ only in P3, which is exactly the point that carries a cubic from a loop, through a cusp, to an ordinary S.

Quadratic β€” three points, and it is always a parabola κ ≠ 0 ∀t
Cubic with an inflection β€” the S a quadratic cannot make κ(0.5) = 0
Cusp β€” where the curve stops dead and turns around B′(0.5) = (0, 0)
Loop β€” one point, visited twice B(0.211) = B(0.789)
Degree 5 β€” more points, less control min |B − P₃| = 134

01

Quadratic β€” three points, and it is always a parabola

What you know: Three control points, degree 2. The curve leaves P0 aimed straight at P1 and arrives at P2 coming straight from P1, and the single middle point is the only handle you have.

How to tell: κ ≠ 0 ∀t

Worked example: P0 (50, 250), P1 (250, 30), P2 (450, 250) β†’ B(0.50) = (250, 140), which is exactly halfway between P1 and the chord's midpoint (250, 250). The curve never gets closer than 110 px to P1.

Open this case: Quadratic
Quadratic β€” three points, and it is always a parabola. The apex lands at (250, 140) β€” halfway between the control point and the chord. Three control points, degree 2. The curve leaves P0 aimed straight at P1 and arrives at P2 coming straight from P1, and the single middle point is the only handle you have.
The apex lands at (250, 140) β€” halfway between the control point and the chord.

02

Cubic with an inflection β€” the S a quadratic cannot make

What you know: Four control points, degree 3, with P1 pulling above the chord and P2 pulling below it. The curve bends one way, then the other.

How to tell: κ(0.5) = 0

Worked example: P0 (50, 250), P1 (150, 50), P2 (350, 250), P3 (450, 50) β†’ the cross product Bβ€² Γ— Bβ€³ falls in a straight line from positive at t = 0 to negative at t = 1, crossing zero at t = 0.50, so the single inflection sits exactly at B(0.50) = (250, 150).

Open this case: Cubic S
Cubic with an inflection β€” the S a quadratic cannot make. Curvature crosses zero at t = 0.50: the bend reverses at (250, 150). Four control points, degree 3, with P1 pulling above the chord and P2 pulling below it. The curve bends one way, then the other.
Curvature crosses zero at t = 0.50: the bend reverses at (250, 150).

03

Cusp β€” where the curve stops dead and turns around

What you know: Four points, with P1 and P2 thrown across each other so that both components of the velocity run out at the same instant. Degree 3.

How to tell: B′(0.5) = (0, 0)

Worked example: P0 (100, 200), P1 (400, 50), P2 (100, 50), P3 (400, 200) β†’ xβ€²(t) = 900(1 βˆ’ 2t)Β² and yβ€²(t) = 450(2t βˆ’ 1), so Bβ€²(0.50) = (0, 0). The curve reaches (250, 87.5), halts, and leaves in the direction it came from.

Open this case: Cusp
Cusp β€” where the curve stops dead and turns around. Bβ€²(0.5) = (0, 0): the tracing point stops at (250, 87.5) and reverses. Four points, with P1 and P2 thrown across each other so that both components of the velocity run out at the same instant. Degree 3.
Bβ€²(0.5) = (0, 0): the tracing point stops at (250, 87.5) and reverses.

04

Loop β€” one point, visited twice

What you know: The cusp's P0, P1 and P2 exactly, with P3 pulled back from x = 400 to x = 280 so the control polygon crosses itself more sharply. Degree 3.

How to tell: B(0.211) = B(0.789)

Worked example: P0 (100, 200), P1 (400, 50), P2 (100, 50), P3 (280, 200) β†’ B(t) = B(1 βˆ’ t) at t = Β½ βˆ“ √3⁄6, that is t β‰ˆ 0.211 and t β‰ˆ 0.789, and both land on exactly (220, 125).

Open this case: Cubic Loop
Loop β€” one point, visited twice. Two parameters, one point: t β‰ˆ 0.211 and t β‰ˆ 0.789 both give (220, 125). The cusp's P0, P1 and P2 exactly, with P3 pulled back from x = 400 to x = 280 so the control polygon crosses itself more sharply. Degree 3.
Two parameters, one point: t β‰ˆ 0.211 and t β‰ˆ 0.789 both give (220, 125).

05

Degree 5 β€” more points, less control

What you know: Six control points, degree 5. Every one of them has a nonzero weight at every value of t, so nudging any single point changes the whole curve.

How to tell: min |B − P₃| = 134

Worked example: The six points span y from 20 to 280, but the curve only covers y from 150 to 250, and it never comes within 134 px of P3 (300, 20). At t = 0.5 the weights are 0.031, 0.156, 0.313, 0.313, 0.156, 0.031 β€” every point counted, none of them in charge.

Open this case: Degree5
Degree 5 β€” more points, less control. The curve never rises above y = 150 while its own control points reach y = 20. Six control points, degree 5. Every one of them has a nonzero weight at every value of t, so nudging any single point changes the whole curve.
The curve never rises above y = 150 while its own control points reach y = 20.
References (3)
  • The Bernstein basis and its weight bounds: Farouki, R. T. (2012). "The Bernstein polynomial basis: A centennial retrospective." Computer Aided Geometric Design 29(6), 379–419.
  • The algorithm the tool animates, and the naming: Farin, G. Curves and Surfaces for CAGD: A Practical Guide, 5th ed. Morgan Kaufmann, 2002 β€” de Casteljau’s algorithm, the convex-hull property and endpoint interpolation. ISBN 978-1-55860-737-8.
  • De Casteljau’s own account of the unpublished CitroΓ«n work: de Casteljau, P. (1999). "De Casteljau’s autobiography: My time at CitroΓ«n." Computer Aided Geometric Design 16(7), 583–586. No DOI is linked here because the record could not be resolved to one.

Problems solved in full

  1. The curve point at t = 0.50 that stops bending one way 6 steps

    The cubic on the page has control points P0 = (50, 250), P1 = (150, 50), P2 = (350, 250), P3 = (450, 50), in a 500 Γ— 300 frame with y measured downward. The panel prints the curve point at t = 0.50. Show that this point is the one place where the curve stops bending one way and starts bending the other.

    1. At t = 1/2 the four Bernstein weights are 1/8, 3/8, 3/8, 1/8, so the two interior points count three times as heavily as the ends. That is the whole of the arithmetic: x = (50 + 450 + 1050 + 450)/8 and y = (250 + 150 + 750 + 50)/8.

    2. Bending is the second derivative, and differentiating a cubic twice leaves something linear in t. Each of the two vectors it is built from is a second difference of three consecutive control points.

    3. Work them out. They come out equal and opposite β€” a fact about the control polygon, available before any curve is drawn.

    4. So the second derivative is one fixed direction, (100, 400), scaled by 1 βˆ’ 2t. Both of its components reach 0 at t = 1/2, and at no other t in the range.

    5. Zero acceleration alone does not make an inflection; a curve that stops dead has it too. So check the velocity. It is (450, 0): horizontal, and emphatically not zero, so the point is moving through the flat spot rather than turning round in it.

    6. Curvature takes the sign of xβ€²yβ€³ βˆ’ yβ€²xβ€³. Multiply out and the bracket collapses β€” the two t-dependent pieces cancel to a constant 3 β€” leaving a numerator exactly proportional to 1 βˆ’ 2t. A quantity linear in t crosses zero once, so this cubic has exactly one inflection and it is at t = 1/2.

    Answer

    (250.0, 150.0) is the curve's only inflection. Its position is not an accident of these particular numbers. The condition that killed the second derivative, P3 βˆ’ P2 = P1 βˆ’ P0, rearranges to P0 + P3 = P1 + P2 = (500, 300) β€” and B(t) + B(1 βˆ’ t) is itself a cubic BΓ©zier, on the reversed-and-added control points P0+P3, P1+P2, P2+P1, P3+P0. All four are the same point, so that sum is the constant (500, 300) for every t. Check it at a quarter turn: B(0.25) = (140.625, 162.5) and B(0.75) = (359.375, 137.5) add to exactly that. The curve is point-symmetric about (250.0, 150.0), and a shape that looks identical after half a turn about a point cannot be bending either way there. The dashed control polygon carries the whole argument: its first and last segments are the same vector, (100, βˆ’200), so the inflection is at the midpoint before the curve exists.

  2. A corner traced at B(0.50) by differentiable polynomials 6 steps

    The cusp state uses P0 = (100, 200), P1 = (400, 50), P2 = (100, 50), P3 = (400, 200), and the panel prints B(0.50) = (250.0, 87.5). Both coordinates are polynomials in t, so the motion is differentiable as many times as you like. Show that the shape it traces has a corner at that point anyway.

    1. Same weights as any cubic at the halfway parameter: 1/8, 3/8, 3/8, 1/8. x = (100 + 1200 + 300 + 400)/8 and y = (200 + 150 + 150 + 200)/8.

    2. The derivative of a cubic BΓ©zier is built from the three edges of the control polygon, weighted by the quadratic Bernstein basis. Differentiating never needs the points themselves, only the steps between them.

    3. Here the middle edge runs backwards. P1 βˆ’ P0 and P3 βˆ’ P2 both push right, while P2 βˆ’ P1 pushes 300 to the left β€” and its vertical part is 0, so it cannot cancel anything in y.

    4. Collect the components and both collapse to a single term. The horizontal speed is a perfect square, so it never turns negative; the vertical speed is linear and does change sign. They vanish together at t = 1/2, which is the tracing point coming to a complete stop.

    5. A stop is not automatically a corner β€” the direction could survive the pause. Take the ratio and it goes to 0 from both sides, so the tangent stands vertical on the way in and vertical on the way out, with yβ€² reversing sign across it. The direction flips by 180Β°.

    6. As with the second derivative, the stop is a statement about the polygon. Bβ€²(1/2) works out to three quarters of (P2 + P3) βˆ’ (P0 + P1), which vanishes exactly when the midpoint of the first edge and the midpoint of the last edge are the same point. Both are (250, 125).

    Answer

    The tracing point stops dead at (250.0, 87.5) and comes back out pointing the opposite way. Nothing about the parametrisation is rough β€” x(t) and y(t) are cubics, differentiable forever β€” and the trace still has a sharp corner, which is why curve continuity is graded twice: CΒΉ asks whether the velocity is continuous, GΒΉ asks whether the direction is, and a zero velocity satisfies the first while destroying the second. There is a measurable consequence too. Since yβ€² = 450(2t βˆ’ 1) is negative before the stop and positive after, y = 87.5 is the smallest value the curve ever takes, so the cusp is the highest point on screen and the whole curve is trapped below it. P1 and P2 sit at y = 50; the curve reaches to within 37.5 of them and no closer, which is the price of pulling on a cubic with only two interior handles.

Example problems

  • Quadratic - Quadratic: degree 2, apex at B(0.50) = (250, 140)
  • Cubic S - Cubic S: inflection at B(0.50) = (250, 150)
  • Cusp - Cusp: the tangent vanishes at B(0.50) = (250, 87.5)
  • Cubic Loop - Cubic loop: degree 3 curve that crosses itself
  • Degree5 - Degree 5 from 6 control points