Rotate In (旋轉入場)

元素從一個點旋轉放大，同時淡入。

在[套用位置]加入「迴旋入場」(Swirl In) 進場動畫，也叫 swirl in forward。
元素從一個點放大到完整尺寸，同時旋轉遠超過一整圈並淡入：一開始很快，落定時逐漸減速。
只對單一元素播放一次，不要套用在整組元素上；如果使用者開啟了「減少動態效果」(prefers-reduced-motion)，就直接在原位顯示、不做動畫。

元素像輪子一樣從左側滾入，同時淡入。

在[套用位置]加入「翻滾入場」(Roll In) 進場動畫。
元素像輪子一樣邊轉動邊從左側滾入，同時淡入：流暢，落定時減速。
只播放一次；如果使用者開啟了「減少動態效果」(prefers-reduced-motion)，就直接在原位顯示、不做動畫。

元素從縮小且傾斜的狀態彈出，略微超出後穩定下來，就像驚奇箱裡的彈簧小丑。

在[套用位置]加入「玩偶盒彈出」(Jack In The Box) 進場動畫。
元素以底邊為支點，從很小且傾斜的狀態彈出，越過直立位置左右搖擺，然後穩定下來：有彈性、俏皮。
只播放一次；如果使用者開啟了「減少動態效果」(prefers-reduced-motion)，就直接在原位顯示、不做動畫。

元素繞一個支點旋轉，同時淡出消失。

在[套用位置]加入「旋轉出場」(Rotate Out) 退場動畫。
元素繞自身中心旋轉略多於半圈，同時淡出：流暢，逐漸加速。
旋轉結束後再移除；如果使用者開啟了「減少動態效果」(prefers-reduced-motion)，就立即隱藏。

元素從容器邊緣之外滑入到停靠位置，不帶淡入效果。

在[套用位置]加入「滑入」(Slide In) 進場動畫，也叫 slide in left、slide in right、slide in up 或 slide in down。
元素從容器邊緣之外滑到停靠位置，全程保持完全不透明：快速，平順減速，不要回彈。
在容器邊緣處裁切，避免它在外面時蓋住相鄰元素或產生捲軸；如果使用者開啟了「減少動態效果」(prefers-reduced-motion)，就直接在原位顯示。

元素滑出容器邊緣後消失。

在[套用位置]加入「滑出」(Slide Out) 退場動畫，也叫 slide out up 或 slide out down。
元素保持完全不透明，滑出容器邊緣後消失：快速，離開時加速。
在容器邊緣處裁切，離開畫面後對鍵盤和螢幕閱讀器也隱藏；如果使用者開啟了「減少動態效果」(prefers-reduced-motion)，就立即隱藏。