How it works
Motion animates clipPath strings with matching point counts, e.g. polygon(…) → polygon(…) with the same number of vertices.
Animated clip-path
Circle, polygon, inset and wipe reveals — interpolated by the browser.
sketchMotionCSS
Performance
clip-path animations are paint-only in most engines; keep the element on its own layer.
Accessibility & reduced motion
Content under the clip is in the DOM and readable at all times.
Export
transition={{ duration: 0.9, ease: [0.77, 0, 0.18, 1] }}