CSS Clip-Path Generator

Visually generate clip-path CSS values with draggable handles and live preview

123
Points (3)
1
X Y
2
X Y
3
X Y
Live Preview
#6366f1
Preset Shapes
CSS Output 
clip-path: polygon(50.0% 0.0%, 100.0% 100.0%, 0.0% 100.0%);
-webkit-clip-path: polygon(50.0% 0.0%, 100.0% 100.0%, 0.0% 100.0%);