CSS Clip Path Designer

Clip boxes into custom geometric shapes visually.

Horizontal Offset (10px)

Vertical Offset (10px)

Blur Radius (20px)

Spread Radius (0px)

Inset Shadow

CSS Output

box-shadow: 10px 10px 20px 0px rgba(0,0,0,0.2);

Processed locally in your browser — nothing is uploaded.

FAQ

The clip-path property creates a clipping region that defines what part of an element should be visible.

CSS Border Radius Generator

Design custom border radius corners for CSS layout blocks.

CSS Box Shadow Generator

Design and customize CSS box shadow styles visually.