CSS 陰影產生器
視覺化調整陰影參數，支援多層疊加，一鍵複製可直接使用的 CSS。
預覽
預覽背景
預覽區塊
陰影文字預覽
CSS 輸出
- 選擇 Box Shadow 或 Text Shadow 分頁。
- 調整水平偏移、垂直偏移、模糊半徑、顏色和透明度等參數。
- 點選「新增陰影層」可疊加多層陰影效果。
- 即時預覽滿意後，按「複製 CSS」貼入你的樣式表。
box-shadow 和 text-shadow 有什麼差別？
box-shadow 作用在元素的外框（整個 div、按鈕等），text-shadow 則作用在文字本身。前者支援 inset 和 spread，後者不支援。
可以同時疊加多層陰影嗎？
可以。CSS 允許用逗號分隔多個 shadow 值，越前面的層會顯示在越上方。本工具支援新增多個陰影層並即時預覽疊加效果。
inset 是什麼？
加上 inset 後，陰影會呈現在元素內部而非外部，常用於製作按鈕凹陷效果或內嵌高光。text-shadow 不支援此屬性。
spread 負值有什麼用？
負的 spread 值會讓陰影縮小，常配合大 offset 做出單側投影效果，看起來更自然。
暫無文章
暫時還沒有相關文章，敬請期待。