<< back

Bezier curves

Note: I haven't optimized this page for mobile. Please view on a laptop/desktop.

Bezier curves (or "B-curves") are often used in computer graphics & design to define smooth, flowing shapes.

Have you ever wondered why digital fonts can be resized to arbitrarily large sizes and they still look good and smooth?

Digital fonts aren't images. They don't have resolution issues because they are defined using Bezier curves. As the font changes size, the shapes you see are re-interpolated based on the position of the points defining the Bezier curves. So you have secretly seen thousands of very tiny Bezier curves every time you look at a web browser.

images via "The Mathematics behind Font Shapes --- Bézier Curves and More" - jdhao.github.io

A Bezier curve is a polynomial curve. For example:

However, the user defines them in terms of "anchor points" and "control points" rather than as a polynomial equation d*x^3 + c*x^2 + b*x + a. This is easier shown than explained.

Explore a cubic Bezier curve

Chaining together multiple Bezier curves


In summary, it's hard to make computer interfaces behave in a way that matches your physical intuition.

built apr 3-4, 2023 as a followup exercise from event-horizon