Design
CSS clip-path Generator
Create clip-path shapes visually with draggable points Runs on your device — nothing is uploaded, nothing is stored.
1
X50%
Y0%
2
X100%
Y100%
3
X0%
Y100%
Generated CSS
clip-path: polygon(50% 0%, 100% 100%, 0% 100%); -webkit-clip-path: polygon(50% 0%, 100% 100%, 0% 100%);
Preset Shapes
Click any shape to load it as an editable polygon.
Related
About CSS clip-path Generator
Visually create CSS clip-path shapes. Drag polygon vertices over a live preview, tune circle, ellipse, and rounded inset, then copy production-ready clip-path CSS with triangle, hexagon, star, and bubble presets.
CSS clip-path Generator is a free tool in the Design Tools category on BrowseryTools. It runs entirely in your browser — your data is never uploaded to a server, and there's no registration, no ads, and no watermarks, so your privacy is fully preserved.
Frequently asked questions