拟物化效果生成器
免费在线使用 拟物化效果生成器 无需安装即可使用工具
關於新擬態產生器
新擬態產生器產生被稱為新擬態（柔和 UI）的柔軟、立體凸出效果。你選擇形狀——扁平、按壓或凸出——並在背景色上調整距離、模糊和圓角，工具會即時建構對應的 box-shadow CSS。預覽能準確顯示元素的外觀，可複製的程式碼區塊則持有樣式。全部在瀏覽器本地執行。
使用方法
1. 選擇形狀：扁平、按壓或凸出 2. 設定與介面相符的背景色 3. 調整距離、模糊和圓角滑桿 4. 觀察預覽即時更新 5. 點擊「複製」取得生成的 CSS
最佳效果建議
當元素與背景顏色相同時，新擬態效果最佳，陰影會融合成柔和的 3D 效果——請選擇接近頁面顏色的背景色。扁平呈凸起外觀，按壓讓元素向內凹陷，凸出則在扁平陰影上添加微妙漸層以獲得圓潤感。較小的模糊值保持邊緣清晰，較大則更柔和。較高的圓角讓形狀更友善。
▶什麼是新擬態？
它是一種設計風格，元素透過柔和且相符的陰影呈現為從背景中凸出或凹陷。新擬態產生器由兩層 box-shadow 和共享的背景色建構這種效果。
▶幾種形狀有什麼區別？
扁平使用外陰影呈凸起外觀。按壓使用內陰影讓元素下陷。凸出在扁平陰影之上添加由淺到深的漸層，呈現圓潤感。
▶為什麼要相符背景色？
效果依賴元素與其周圍環境共用一種顏色。當顏色相符時，雙重陰影會呈現為平滑的 3D 表面，而非獨立的懸浮方塊。
▶距離和模糊控制什麼？
距離讓陰影遠離元素，模糊讓陰影變柔。更小更緊的值更清晰，更大的模糊則帶來更柔和、更漫射的表面。
▶可以複製 CSS 嗎？
可以。「複製」按鈕會把生成的 background、border-radius 和 box-shadow 規則寫入剪貼簿，方便貼到樣式表或樣式區塊中。
如果这个工具对你有帮助，请考虑请我喝杯咖啡。
請幫我買杯咖啡吧。