Background Fade (背景色漸變)

一層半透明覆蓋層替元素染上顏色，表示游標正停在上面。

在[套用位置]加入「懸停狀態層」(Hover State Layer)，也叫 hover state、state layer 或 hover overlay。
游標懸停時，一層使用內容顏色的淡淡半透明覆蓋層快速淡入蓋住元素，游標移開後淡出。
保持夠淡，不影響對比度；聚焦和按下狀態也使用同樣的狀態層做法。

懸停時，邊框顏色淡入或漸變為新顏色。

在[套用位置]加入「邊框色漸變」(Border Fade) 懸停效果。
游標停在元素上時，邊框從柔和的顏色平順漸變為強調色：含蓄，不帶位移或尺寸變化。
兩種狀態下的邊框粗細保持一致，避免任何位移，鍵盤焦點時也呈現同樣的效果。

懸停時，彩色背景從一側邊緣掃過整個元素。

在[套用位置]加入「背景掃過」(Background Sweep) 懸停效果，也叫背景填充 (background fill) 或滑動填充 (slide fill)。
新的背景色從左側邊緣掃到右側，平順、快速、不回彈，游標移開時以同樣方式退回，同時文字顏色跟著切換以維持可讀性。
讓填色始終裁切在元素的形狀之內，鍵盤焦點時也呈現同樣的效果。

游標懸停時填滿的背景消失，只留下外框按鈕。

在[套用位置]加入「空心化」(Hollow) 懸停效果，也叫 ghost fill。
填滿的背景淡出，只留下外框，文字顏色隨之切換，在空背景上依然清楚易讀：流暢而快速。
兩種狀態的邊框粗細保持一致，避免元素尺寸改變；鍵盤聚焦時也顯示同樣的效果。

懸停期間，元素先向上浮起，然後持續上下輕輕浮動。

在[套用位置]加入「上下浮動」(Bob) 懸停效果，也叫懸掛 (hang)。
元素先輕輕浮起，游標停留期間持續柔和地上下浮動，游標移開後再落回原位：緩慢而柔和。
只在懸停期間循環浮動；如果使用者開啟了「減少動態效果」(prefers-reduced-motion)，就保持靜止。