.a { shared-transition-effect: exchange; shared-transition-name: shared-transition; shared-transition-timing-function: friction; } @keyframes shared-transition { from { opacity: 0; transform: translate(0px) rotate(0deg) scale(1.0); } to { opacity: 1; transform: translate(100px) rotate(180deg) scale(2.0); } } .s{ transition-enter: "translate(100px) rotate(180deg) scale(2.0)"; transition-exit: 'translate(100px) rotate(180deg) scale(2.0)'; transition-duration: 100ms; transition-timing-function: friction }