◩
圖片與設計工具
Box Shadow Generator
Box Shadow Generator 在瀏覽器中執行，用於檢查、轉換或準備結果，不會把輸入傳送到伺服器。
圖片與設計工具
Input / output
Shadow preview
2 layers
CSS 코드
box-shadow: 0px 8px 24px -8px rgb(0 0 0 / 0.18), 0px 2px 6px 0px rgb(37 99 235 / 0.12);
Tailwind shadow
shadow-[0px_8px_24px_-8px_rgb(0_0_0_/_0.18),_0px_2px_6px_0px_rgb(37_99_235_/_0.12)]
Shadow layers
Layer 1
Layer 2
HelpOpen usage notes, examples, practical tips, and FAQ only when you need them.
What is this tool?
Box Shadow Generator 是用於圖片與設計流程的本機瀏覽器工具，輸入、選項與結果都在同一頁完成。
How to use it
- 貼上輸入
在輸入區域輸入或貼上要處理的值。
- 調整選項
選擇適合 box shadow, CSS shadow, elevation 的模式、格式或單位。
- 檢查結果
執行工具，確認結果後再複製或下載。
Examples
Box Shadow Generator 範例
- Input
- 範例輸入
- Output
- 在瀏覽器中檢查後的輸出。
Practical tips
- 內容較大時，先從小樣本開始。
- 廣告會保持在主要控制項和結果區域之外。
FAQ
Box Shadow Generator 應該輸入什麼？
請輸入與頁面任務相符的值，並在執行前調整選項。
可以複製 Box Shadow Generator 的結果嗎？
可以。檢查結果後即可複製或下載。
Box Shadow Generator 支援行動裝置嗎？
支援。輸入、選項和結果會在小螢幕上縱向排列。
輸入會傳送到伺服器嗎？
不會。此工具設計為在瀏覽器內處理輸入。