CSS 漸層產生器
使用此免費線上工具輕鬆製作漂亮的 CSS 漸層。支援線性與放射狀漸層、多個顏色斷點以及角度調整。
使用視覺化編輯器製作 CSS 線性與放射漸層效果，調整色彩斷點與角度後一鍵複製程式碼直接套用到專案中。
CSS 漸層產生器
使用此免費線上工具輕鬆製作漂亮的 CSS 漸層。支援線性與放射狀漸層、多個顏色斷點以及角度調整。
關於這個工具
使用視覺化編輯器製作 CSS 線性與放射漸層效果，調整色彩斷點與角度後一鍵複製程式碼直接套用到專案中。
自訂您的漸層設定。
自訂您的漸層設定。
線性
角度 (deg)
顏色斷點
0%
100%
結果將顯示於此...
預覽
CSS 程式碼
自訂您的漸層設定。
自訂您的漸層設定。
線性
角度 (deg)
顏色斷點
0%
100%
常見問題
關於這個主題的常見疑問與實用解答。
支援哪些漸層類型？
支援線性與放射狀漸層，可完全控制角度、形狀與顏色斷點位置。
可以新增多個顏色斷點嗎？
可以，可新增任意數量的顏色斷點並自訂位置，創造複雜的漸層效果。
產生的程式碼跨瀏覽器相容嗎？
是的，輸出標準 CSS 漸層語法，適用於所有現代瀏覽器。
我的資料會被傳送到伺服器嗎？
不會，漸層 CSS 生成完全在您的瀏覽器中進行。您的顏色選擇與設定在本地處理，不會傳送至任何伺服器。