Cycloid
Draw a cycloid, the curve traced by a point on the rim of a circle rolling along a straight line: x = r(t − sin t), y = r(1 − cos t). Show the rolling circle, the circle at several places, the cusps and any number of arches, and see the arch length 8r and the area 3πr² for your size. Turn it upside down to see why it is the brachistochrone (the quickest slide between two points) and the tautochrone (the same time from any start), with times worked out for a drop you choose. Start from one of 14 presets, then download a PDF at real size, a 300 DPI PNG or an SVG. Nothing is uploaded.
100% private — everything runs in your browser. Everything runs in your browser; nothing is uploaded.
Print at 100% (Actual size). The SVG holds the drawing at the size you typed, each curve as one line, for a pen plotter, laser or cutter.
Cycloid
Draw
Lines
Page
Runs in your browser with our own code: nothing you type is uploaded or saved. Every line and every time is worked out from the cycloid formula by our own code. You may use what you make here, including commercially, with no credit needed.
How to draw and print a cycloid
- Pick a preset, or choose what to show: the rolling circle, the brachistochrone or the tautochrone.
- For the rolling view, choose the number of arches and tick the rolling circle, the circle at several places or the cusps.
- For the brachistochrone, tick the circular arc and the straight ramp to compare, and type the drop height in metres for the times.
- Press Animate to watch the circle roll or the beads slide.
- Pick the colours, size and paper, then download the PDF and print at 100% (Actual size), or the SVG for a plotter or cutter.
What you can use it for
- Maths and physics lessons: roulettes, arc length and the brachistochrone problem
- Calculus classes: length 8r and area 3πr² you can check on paper
- Model ramps and marble runs: the cycloid track printed at real size
- Pen plotter, laser engraving and vinyl art
- Borders and strips of arches for posters and cards
- Science fair boards and classroom displays
The 14 presets
| Preset | View | Arches | What is drawn |
|---|---|---|---|
| One arch with the rolling circle | Rolling | 1 | rolling circle, cusps |
| One arch, the curve only | Rolling | 1 | curve only |
| Two arches, cusps marked | Rolling | 2 | cusps |
| Three arches with the rolling circle | Rolling | 3 | rolling circle |
| Four arches in a row | Rolling | 4 | curve only |
| Six arches in a row | Rolling | 6 | cusps |
| One arch, the circle at 9 places | Rolling | 1 | circle at 9 places, cusps |
| Two arches, the circle at 13 places | Rolling | 2 | circle at 13 places |
| Brachistochrone: cycloid, arc and ramp with time marks | Brachistochrone | – | circular arc, straight ramp, time marks |
| Brachistochrone: the three paths only | Brachistochrone | – | circular arc, straight ramp |
| Brachistochrone: cycloid against a straight ramp | Brachistochrone | – | straight ramp, time marks |
| Tautochrone: four beads from different heights | Tautochrone | – | 4 beads, time marks |
| Tautochrone: two beads, start and halfway | Tautochrone | – | 2 beads, time marks |
| Tautochrone: the bowl and start points only | Tautochrone | – | 4 beads |
The rolling presets draw the curve from the same formula as the circle, so the pen dot always sits on the curve. The brachistochrone and tautochrone presets use the upside-down arch.
Size, length and area
| Rolling circle r | Arch width 2πr | Arch height 2r | Arch length 8r | Area under one arch 3πr² |
|---|---|---|---|---|
| 10 mm | 62.8 mm | 20.0 mm | 80.0 mm | 942 mm² |
| 20 mm | 125.7 mm | 40.0 mm | 160.0 mm | 3770 mm² |
| 25.4 mm | 159.6 mm | 50.8 mm | 203.2 mm | 6080 mm² |
The PDF prints r, the arch width, height, length and area for the size you choose, and a 1 in (or 2 cm) bar to check the print scale.
Quickest slide: the brachistochrone
| Path from the top point to the lowest point | Time for a 1 m drop | Time in units of √(r/g) |
|---|---|---|
| Upside-down cycloid | 0.709 s | 3.1416 (= π) |
| Circular arc, lowest point at the end | 0.718 s | 3.1789 |
| Straight ramp | 0.841 s | 3.7242 |
From rest, no friction, g = 9.80665 m/s². The end points are the top of an arch and its lowest point, half an arch along (a drop of 2r over a width of πr). The time marks are dots at equal time steps, so the gaps show where each bead is fast or slow.
What prints
| Download | What is in it |
|---|---|
| The page at real size, vector: the drawing, the sizes or times for your settings, and a check bar | |
| PNG 300 DPI | The same page as a picture |
| SVG (real size) | Only the drawing: each curve as one path, circles, arms, dots |
For a cutter that needs DXF, use SVG to DXF.
Which tool to use
| You want | Use |
|---|---|
| A circle rolling on a straight line, pen on the rim | Cycloid (this page) |
| The same with the pen inside or outside the circle (waves, loops) | Trochoid |
| A circle rolling round the outside of a circle | Epicycloid |
| A circle rolling round the inside of a circle | Hypocycloid |
| Gear wheels with a pen hole | Spirograph Generator |
Different tools: the Spirograph Generator draws gear curves with the pen inside the wheel, the SVG Wave Generator draws smooth section dividers for web pages, and the Guilloche Pattern Generator draws banknote-style line patterns.
More free tools
Curves, patterns and generative art?
Drawing and print tools that run privately in your browser, with no sign-up and no watermark.
Frequently asked questions
What is a cycloid?
The curve traced by a point on the rim of a circle as the circle rolls along a straight line without slipping. With the circle of radius r turned through an angle t, the point is at x = r(t − sin t), y = r(1 − cos t). Each turn of the circle draws one arch, and the arches meet in sharp points called cusps, one every 2πr along the line.
How long is one arch, and what area does it cover?
One arch is 8r long, four times the diameter of the circle, and the area between the arch and the line is 3πr², three times the area of the circle. The tool shows both for your size, and our tests check them by numerical integration.
What is the brachistochrone?
The curve of quickest descent: the path down which a bead slides from one point to a lower point in the least time, under gravity and without friction. Johann Bernoulli posed the problem in 1696, and the answer is an upside-down cycloid. The tool draws it from the top of an arch to its lowest point.
Is the cycloid really quicker than a straight ramp?
Yes. For a 1 m drop with g = 9.80665 m/s² and no friction, the tool works out 0.709 s along the cycloid, 0.718 s along a circular arc between the same two points and 0.841 s down the straight ramp. The straight line is the shortest path but the slowest of the three, because the bead picks up speed slowly at the start. Our tests check the times against our own step-by-step simulation of the bead.
What is the tautochrone?
The same upside-down cycloid has another property: a bead let go from anywhere on it reaches the bottom in the same time, π√(r/g). Christiaan Huygens found this. For a bowl 1 m deep (r = 0.5 m), the tool works out 0.709 s from every one of its four start points, and the time marks show the beads arriving together.
Which times does the tool show, and what does it leave out?
Times for a bead sliding without friction from rest, with g = 9.80665 m/s², for the drop height you type. A rolling ball, friction and air resistance all change the times, so a real marble run will be slower; the order of the three paths is what the drawing shows.
How is a cycloid different from a trochoid?
A cycloid has the pen exactly on the rim of the rolling circle, so it touches the line at each cusp. Move the pen inside the circle and the curve becomes a smooth wave; move it outside and the curve gains loops. Those curves are trochoids, which have their own page.
How is this different from a spirograph?
In a spirograph the wheel rolls round a ring and the pen sits in a hole inside the wheel. Here the circle rolls along a straight line and the pen is on its rim, so the curve is a row of arches with cusps.
Can I use it on a pen plotter, laser or cutter?
Yes. The SVG download is the drawing at the real size you typed: each curve is one unbroken path, so a plotter draws it in one stroke. For a program that wants DXF, convert the SVG with our SVG to DXF tool.
Is it free?
Yes. There is no sign-up, no watermark and no limit.
Is anything uploaded?
No. Every line and every number is worked out by JavaScript in your browser. Nothing you type is sent anywhere or saved when you close the page.