You have a CSS grid of cards. You want a view transition that animates every card from its old position to its new one, individually. The rule is non-negotiable: each snapshot needs a unique view-transition-name. The interesting part is no longer that requirement. It is how you assign those names without hand-writing one per card.
Bramus puts the two modern answers next to each other, prompted by Kevin Powell demonstrating one of them at CSS Day and Cyd Stumpel asking about the other in the Q&A. Both produce individual snapshots. They are not the same tool.
The attr() route
Drop a data attribute on each card, then read it from CSS:
.card {








