Skip to main content

Bezier Curve Calculator

Quick answer

Evaluate quadratic/cubic Bezier curves B(t) = (1−t)³P₀ + 3(1−t)²tP₁ + 3(1−t)t²P₂ + t³P₃.

  • Example: t = 0.5 with P₀=(0,0), P₃=(2,0) → (1, ...).
  • Free tool.

Figures are estimates from this calculator’s standard formula — adjust the inputs in the tool below for your exact number.

How Bezier Curve Calculator Works

B(t) = (1-t)²P0 + 2(1-t)tP1 + t²P2 (Quadratic)

Calculate points along Bezier curves using control points. The parameter t ranges from 0 (start) to 1 (end) and determines position along the curve. Worked example: with P₀ = (0, 0), P₁ = (0, 2), P₂ = (2, 2), P₃ = (2, 0), t = 0.5 gives B = 0.125·P₀ + 0.375·P₁ + 0.375·P₂ + 0.125·P₃ = (1, 1.5).

  1. 1

    Step 1

    Select curve type (Quadratic or Cubic)

  2. 2

    Step 2

    Enter control point coordinates

  3. 3

    Step 3

    Set the parameter t value (0 to 1)

  4. 4

    Step 4

    View the calculated point on the curve

Use Cases

Vector graphics design (Adobe Illustrator, Figma)

Animation path creation

Font design and typography

CSS transitions and easing functions

Tips

  • 1

    t=0 gives the starting point P0 and t=1 gives the ending point

  • 2

    A quadratic curve needs 3 points and a cubic needs 4 points

  • 3

    Control points define the curve shape but the curve does not necessarily pass through them

  • 4

    Bezier curves are the foundation of SVG files and TrueType fonts

  • 5

    Multiple Bezier curves can be connected to create complex shapes

Common Mistakes

  • Entering a t value outside the 0-1 range

  • Confusing control points with pass-through points

  • Not understanding that the curve does not pass through middle control points

  • Using a quadratic curve for shapes that need more flexibility

FAQs

What is the difference between quadratic and cubic Bezier curves?

Quadratic uses 3 control points (degree 2) and gives a simple curve. Cubic uses 4 points (degree 3) and provides more control over the curve shape.

What does the parameter t represent?

t is a parameter ranging from 0 to 1. At t=0 you are at the start point, at t=1 at the end point. Values in between give points along the curve.

Does the curve pass through the control points?

It only passes through the start and end points (P0 and P2/P3). Middle control points define the direction of the curve but it does not pass through them.

Where are Bezier curves used?

In design software (Illustrator, Figma), digital fonts (TrueType, OpenType), vector image files (SVG), and animations (CSS transitions).

How do I create a smooth Bezier curve connected to another curve?

To ensure smooth continuity, the last control point of the first curve and the first control point of the second must be collinear with the connection point.