✂️
CSS Clip Path Generator
Interactively create clip-path shapes with draggable points and live preview.
Preset Shapes
Drag points in the preview to adjust the shape
Point 1X: 50% Y: 0%
Point 2X: 100% Y: 100%
Point 3X: 0% Y: 100%
Preview
Generated CSS
clip-path: polygon(50% 0%, 100% 100%, 0% 100%);