Create triangles, hexagons, stars, and custom polygon shapes using CSS clip-path.
clip-path crops an element to a geometric shape by hiding everything outside the path. The polygon() function accepts any number of x/y coordinate pairs, enabling unlimited shape possibilities. clip-path shapes can be animated with transition for morph effects and work on images, divs, and video elements.
Usage Note
clip-path: polygon() coordinates are percentages of the element's bounding box. Use clippy.adhang.in to generate shapes visually. For image masking, apply clip-path directly to the <img> tag. clip-path is hardware-accelerated and safe to animate.
