Clip Path Generator

About this plugin

✨ CSS and SVG Clip Path Generator

CSS Clip-Path Maker - Visual Shape Editor

1. Upgrade in plugin via Figma or get a license key

New features:

1. Edit polygon paths
2. Added new path mask complex shapes
3. Edit in codepen
4. Better svg and css code generation

Create stunning CSS clip-path shapes with visual editor and draggable handles

Transform your web designs with this powerful visual CSS clip-path generator. Create stunning geometric shapes, custom polygons, and complex clipping masks without writing code.

Key Features:

1. Image Gallery Selector - Choose from curated background images to preview your clip paths
2. Upload from Device - Test your shapes with your own images for perfect results
3. Editable Polygon Handles - Drag vertices to fine-tune your shapes in real-time
4. Complex Path Shapes - pre-built shapes: triangles, stars, arrows, frames, and more
5. HTML & CSS Code - Get clean, copy-ready CSS clip-path code instantly
6. SVG Code Support - Export shapes as SVG paths for maximum compatibility
7. Live Preview - See your changes instantly with real-time visual feedback
8. One-Click Copy - Copy CSS code to clipboard with a single click

Perfect for web designers, developers, and anyone looking to add unique geometric elements to their projects. No coding experience required - just point, click, and create!