Back to generator

Star Divider Clip Path CSS

Star Divider is an edge-forward crop for page dividers for CSS clip-path layouts.

clip-path

Editable Shape

Output

Copy-ready CSS

Pure CSS

clip-path: polygon(50% 19%, 62% 40.7%, 100% 40.7%, 69% 53.7%, 82% 81%, 50% 63.6%, 18% 81%, 31% 53.7%, 0% 40.7%, 38% 40.7%);

Tailwind v4

[clip-path:polygon(50%_19%\,_62%_40.7%\,_100%_40.7%\,_69%_53.7%\,_82%_81%\,_50%_63.6%\,_18%_81%\,_31%_53.7%\,_0%_40.7%\,_38%_40.7%)]
Try it in the generator

When to use it

Star Divider is a star clip-path preset for interface shapes, cropped media blocks, section edges, and decorative CSS cuts. It uses 10 polygon points, which keeps the effect readable while still giving the element a custom silhouette. Star Divider is an edge-forward crop for page dividers for CSS clip-path layouts. The preset is written as plain CSS, so it works with images, cards, gradient panels, and pseudo-elements without requiring SVG assets. Use it when a rectangular block feels too flat, or when a star shape needs to guide attention across a page. Open it in the generator to drag individual vertices, switch templates, and copy the updated clip-path or Tailwind arbitrary value.

Explore more

More CSS Forge paths

Related

Similar clip paths

These presets share shape and layout tags with Star Divider.