視覺樣式詞條 3-30

陰影Shadow

也常叫做：陰影、投影、Shadow

你可能會這樣說

想做出卡片浮在頁面上的層次感，套了陰影後不是又黑又髒，就是整頁灰濛濛的像蓋了一層霧。

陰影的作用是暗示高度：哪個東西浮得比較高、可以互動。真正高級的陰影都淡、大、柔——接近黑但透明度低、模糊開來，而不是一小圈深色貼著邊。

常用兩層疊法：一層貼近的小陰影，加一層擴散的大陰影，卡片就像真的懸空。滑鼠移過時稍微加深或上浮，互動感就出來了。

跟 AI 描述品質比記語法重要：「很淡的長陰影，不要髒灰色，帶一點點主色調」。

垂直位移模糊擴散

淡、大、柔才高級：模糊開大、透明度壓低；一小圈深色貼著邊，只會顯髒。

圖 3-30　位移、模糊、擴散三個拉桿——卡片浮起來的高度感全靠它們。

中文就可以

請調整卡片的陰影質感：
一般狀態用兩層陰影：一層小而近、一層大而淡，顏色用 8% 透明度的深色，不要純黑。
滑鼠移過時卡片往上 2px、陰影加深放寬，加 0.2 秒平滑過渡。
背景維持乾淨的淺色，不要被陰影染灰。
給我前後對照，陰影要看起來「輕」而不是「髒」。