SVG Path Smoother – Clean Up Jagged Paths Fast

Use the free SVG Path Smoother below: your data never leaves your browser — all work happens on your device, and nothing is uploaded to any server.

Why Paths Get Jagged

Jagged paths come from everywhere: a hand-drawn trace, a mouse-recorded stroke, a converted bitmap, or a sensor log with noisy samples. Each source adds tiny direction changes that the eye reads as roughness, even when the overall shape is fine. Smoothing removes those tiny changes while keeping the overall shape, so a shaky line becomes a clean curve. The tool above smooths pasted SVG paths, using Paper.js simplify when available, with a built-in Chaikin smoothing fallback, and gives you cleaned SVG to copy or download.

The input is the d attribute of an SVG path, the string of M and L commands that lists the points. The tool parses those points, simplifies them, and draws the result on a preview canvas so you can compare the smoothed curve with the jagged original in your head. The output is a new path string, wrapped in a complete SVG file, ready to paste into a page or open in a vector editor.

How to Use the Smoother

Paste your path data into the box. The default example is a zigzag line, which is a good test: smooth it at a low value and at a high value, and watch the difference. Set the smoothing slider to a low value, around five, when you want to keep detail and only remove the smallest jitters. Set it to a high value, around twenty or more, when you want a flowing curve and can afford to lose sharp corners. Then pick a stroke colour, press Smooth path, and copy or download the result.

Check the output shape before using it. Smoothing is a trade-off, not a free improvement: too much smoothing rounds corners that should stay sharp, such as the point of a star or the corner of a letter. If a corner matters, smooth in two passes instead of one hard pass, or split the path at the corner and smooth each part separately.

How Simplify and Chaikin Differ

Paper.js simplify works by removing points that do not change the shape much, then fitting smooth curves through the points that remain. It is good at preserving the overall outline while cutting the point count sharply, which also makes files smaller. Chaikin smoothing works differently: it repeatedly cuts corners, replacing each corner with two new points, which rounds the path gradually. Both approaches produce clean curves, but simplify is better for noisy traces with many redundant points, while Chaikin is better when you want gentle, even rounding.

The tool reports which engine ran, so you know what produced your output. If Paper.js cannot load, the Chaikin fallback still gives you a genuinely smoothed path, not an error. That fallback matters, because a tool that fails when a library fails is a tool you cannot rely on for real work.

Preparing Paths for Smoothing

Clean input smooths better. Remove duplicate points, where the same coordinate repeats, because duplicates can confuse curve fitting. Keep the point order: a path that jumps back and forth will smooth into a tangle, not a curve. If your path uses curve commands such as C or Q, convert them to line segments first, or simplify the polyline you sampled from them. And keep the coordinate scale sane: paths in the hundreds of units, like the default example, smooth predictably, while paths in the millions can make tolerance values hard to judge.

Also consider whether smoothing is the right fix at all. A path that is jagged because it has too few points needs more points, not smoothing. A path that is jagged because of noise needs smoothing. Look at the point count: hundreds of points with tiny steps means noise, and smoothing will help. A dozen points with big steps means a coarse shape, and smoothing will only round what is already there.

Frequently Asked Questions

Why did my sharp corner disappear? High smoothing rounds every corner, including deliberate ones. Lower the value, or split the path at the corner and smooth the parts separately.

Does smoothing reduce file size? Usually yes, because simplify removes redundant points. A noisy trace with thousands of points can shrink to a fraction of its size with no visible change.

Can I smooth a closed shape? Yes, as long as the path data lists the points in order. The tool treats the point list as a stroke; for a closed shape, make sure the last point meets the first.

Paste a jagged path above, tune the smoothing until the shape reads clean, and download the result.

Related tools

1 thought on “SVG Path Smoother – Clean Up Jagged Paths Fast”

  1. Pingback: Suavizador de Rutas SVG - Limpia Trazos Irregulares Rápido

Leave a Comment

Your email address will not be published. Required fields are marked *

Scroll to Top