什麼是 CSS 盒陰影產生器？
免費線上 CSS 盒陰影產生器。透過視覺化控制項調整偏移、模糊、擴散與顏色，即時產生 CSS 程式碼。
CSS box-shadow 屬性是網頁設計師工具組中用途最廣的工具之一，能為 UI 元素增加深度、層次與視覺趣味。CSS Box Shadow 產生器提供視覺化介面來建立 box-shadow CSS 程式碼，對每個參數都有完整控制，並提供即時更新的互動式預覽。
產生器透過滑桿公開五個可調整參數。X 偏移水平移動陰影（正值向右移，負值向左移）。Y 偏移垂直移動陰影（正值向下移，負值向上移）。模糊半徑控制陰影邊緣的柔和度——零會產生銳利的陰影，較高的值則產生較柔和、更擴散的效果。擴散半徑會在不影響模糊的情況下擴大或縮小陰影尺寸。色彩選擇器設定陰影顏色，並可透過 Alpha 色版控制不透明度。
即時預覽卡片會立即顯示每次調整的效果。預覽卡片以白色背景與圓角樣式設計，模擬真實的 UI 元件，讓您能確切看到陰影在實際介面元素上看起來的效果。內建六個預設陰影供快速選取：細緻、中等、厚重、模糊、內凹與浮起。
產生的 CSS box-shadow 程式碼以可直接複製的格式顯示。輸出支援完整的簡寫語法，包括用於內陰影的 inset 關鍵字。可透過複製輸出並手動貼上多個宣告來組合多重 box-shadow 值。工具也會驗證語法是否正確，因此每次複製的都是有效的 CSS 宣告。