Fade Up (上浮淡入)

元素從一側移動一小段距離到最終位置，同時淡入。

在[套用位置]加入「方向淡入」(Fade In Directional) 進場動畫，也叫 fade in left、fade in right 或 fade in down。
元素從一側移動一小段距離到最終位置，同時淡入：快速流暢，到位時減速，不要彈跳。
只播放一次；如果使用者開啟了「減少動態效果」(prefers-reduced-motion)，就直接在原位顯示、不做動畫。

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

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

一組元素依序以微小的時間差播放動畫，形成波浪般的效果，而不是同時出現。

在[套用位置]加入「交錯動畫」(Stagger)，也叫 staggered animation 或級聯 (cascade)。
讓各項以短而均勻的間隔依序上浮出現，整體看起來像一道快速的波浪，而不是同時出現。
即使清單很長也要讓整個過程保持簡短；捲動進入畫面時只播放一次；如果使用者開啟了「減少動態效果」(prefers-reduced-motion)，就直接顯示、不做動畫。

元素在原位從完全透明變為完全不透明，離開時則反過來。

在[套用位置]加入「淡入/淡出」(Fade In / Fade Out) 動畫，也叫 fade。
元素出現時在原位從完全透明變為完全可見，離開時以同樣方式淡出：柔和，不要位移或縮放。
淡出後要確保它無法再被點擊或用鍵盤聚焦；如果使用者開啟了「減少動態效果」(prefers-reduced-motion)，就瞬間切換。

元素像故障的霓虹燈一樣快速閃爍幾下，然後保持可見。

在[套用位置]加入「閃爍入場」(Flicker In) 進場動畫。
元素像故障的霓虹燈一樣，以不規則的間隔亮滅幾次後保持點亮：俐落的閃爍，沒有位移。
只播放一次，閃爍次數要少、速度不能太快，確保對光敏感的人也安全；如果使用者開啟了「減少動態效果」(prefers-reduced-motion)，就直接以恆亮狀態顯示。

元素繞 Y 軸旋轉一整圈，同時稍微靠近觀看者再退回。

在[套用位置]加入「翻轉」(Flip) 動畫。
元素繞垂直軸旋轉一整圈，同時稍微靠近觀看者，然後尺寸微微一縮再回到原位：活潑但簡短。
加上透視 (perspective) 讓旋轉有縱深感，只播放一次、不要循環；如果使用者開啟了「減少動態效果」(prefers-reduced-motion)，就省略旋轉。

元素繞水平軸或垂直軸做 3D 旋轉，從側面朝向轉為正對觀看者。

在[套用位置]加入「翻轉入場」(Flip In) 進場動畫，也叫 flip in X 或 flip in Y。
元素從側面朝向開始，繞水平軸旋轉到正對觀看者，略微轉過頭再回來後穩定：快速，帶一點晃動。
加上透視 (perspective) 讓旋轉有縱深感；如果使用者開啟了「減少動態效果」(prefers-reduced-motion)，就直接以正面狀態顯示、不做動畫。