Create clip-path polygon and circle shapes with live preview. CSS Clip-Path Generator is a free online tool from the ToolsRift CSS Generators collection. It runs entirely in your browser — nothing to install, no signup, and your data never leaves your device.
Pick a shape, drag the points or adjust values on the preview, and copy the generated clip-path CSS.
It crops an element to a shape, hiding everything outside the defined polygon, circle, ellipse or inset region.
Yes — add and drag points to build any polygon shape, and the clip-path percentage coordinates update live.
Yes — clip-path only hides visuals; the element keeps its original box in the layout.