CSS 陰影產生器
免費線上 CSS 陰影產生器。即時預覽製作複雜的多層陰影。可自訂位移、模糊、擴散、顏色與內陰影屬性。
CSS 陰影產生器
免費線上 CSS 陰影產生器。即時預覽製作複雜的多層陰影。可自訂位移、模糊、擴散、顏色與內陰影屬性。
關於 CSS 陰影
建立逗號分隔的多層陰影
每個圖層都會變成一段 box-shadow 值，包含可選的 inset、水平位移、垂直位移、模糊半徑、擴散半徑與顏色。多個圖層會合併在同一個宣告中，符合標準 CSS box-shadow 語法。
區塊顏色只是預覽設定
背景與區塊顏色用來檢查陰影在淺色或有色表面上的效果。它們不會被放進複製片段，輸出只包含產生的 box-shadow 宣告。
常見問題
關於這個主題的常見疑問與實用解答。
可以自訂哪些屬性？
您可以自訂水平與垂直位移、模糊半徑、擴散半徑、陰影顏色，以及切換內陰影模式。
可以新增多層陰影嗎？
可以，可疊加多層陰影以營造複雜的立體效果。每層都可以有獨立的位移、模糊、擴散與顏色設定。
產生的程式碼跨瀏覽器相容嗎？
是的，標準 CSS box-shadow 屬性無需供應商前綴即可在所有現代瀏覽器中運作。
我的資料會被傳送到伺服器嗎？
不會，box-shadow CSS 生成完全在您的瀏覽器中執行。您的陰影設定透過 JavaScript 在本地處理，絕不會離開您的裝置。