Visual SVG Path Editor
Visually draw SVG paths and bezier curves online with an intuitive pen tool, generate CSS clip-path, and watch Alpa walk along your paths!
🎨 SVG Drawing Canvas (500x500)
⚙️ Path Controls
📤 Export Code
SVG Path d code
CSS clip-path code
📖 SVG Path Guide
Click the canvas to add anchor points. In "Select/Edit" mode, drag green clover anchors to move them, and drag blue handles to adjust curves. Click "Let Alpa walk" to use CSS offset-path and make the alpaca run along your custom curves locally in your browser.
