CSS Clip-Path Generator

Create custom shapes and masks with CSS clip-path. Generate polygon, circle, ellipse, and inset shapes.

Quick Shapes

Shape Type

Polygon Points

Format: x y, x y, x y (in % or px)

Clipped Shape

CSS clip-path applied

css

.element {
  clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
}