demo · v134
Interpolated morphs
A central planning use case for shape() was making clip-path actually animatable. path() only interpolates when both keyframes have the same command sequence — shape() lifts that constraint enough to morph between many shape pairs. Pick two presets, hit morph, and watch the transition.
probing shape() animation support…
Try it
From
To
Triangle → blob: both shapes have four commands after rebuilding the triangle as a four-vertex polygon. shape() interpolates each pair component-wise.
Active CSS
see also
- CSS shape() function — feature index
- shape() preset playground — sibling concept
- Chrome Developers — Hello CSS shape()
- CSS Shapes 2 spec — shape()
- ChromeStatus entry