Data Grid
6 effects for the data grid family · every one loops · pure CSS unless a card says otherwise
The previews are open to everyone; the code of these effects comes with WunderUI Core and Pro.
1282,3409144
A new row opens its own space, so the rows below slide down to make room instead of jumping, and fades in as it opens. 250 ms, through grid-template-rows: 0fr → 1fr — the height trick that needs no measuring.
Rows arriving once, in order, when the table loads — then the data stands still. 250 ms a row, 30 ms apart, and the stagger stops growing at 300 ms.
The edge fade appears only when there is more to scroll. Chrome 115+, Safari 26+; Firefox still open.
Revenue ↓