outlay

Animated Layout Transitions

Toggle a flex property and every box glides to its new spot. There are no CSS transitions and no FLIP measurement here: the solver computes the before and after layouts as plain numbers, and each box is interpolated from one (x, y, w, h) to the other. Having layout as arithmetic means both endpoints are yours to tween — something CSS can't hand you once the property has changed.