CSS 漸層生成器 - 建立線性、徑向和圓錐漸層
從下拉選單選擇漸層類型。新增多個色彩停止點,建立精美的 CSS 背景。
預覽
角度 / 方向
90°
顏色停點
#6366f10%
#ec4899100%
CSS
background: linear-gradient(90deg, #6366f1 0%, #ec4899 100%);
使用方法
- 選擇漸層類型(linear/radial/conic)
- 新增和編輯色彩停止點
- 設定方向/角度
- 複製 CSS 程式碼
常見問題
- 支援哪些漸層類型?
- 支援 linear-gradient、radial-gradient 和 conic-gradient。
- 色彩停止點有數量限制嗎?
- 可以自由添加多個色彩停止點。
- 生成的 CSS 可以直接使用嗎?
- 可以。複製程式碼直接貼到 CSS 檔案中使用。
- 資料會傳送至伺服器嗎?
- 所有處理均在瀏覽器中完成,不會將資料傳送至伺服器。
- 如何指定漸層角度?
- 對於線性漸層,可透過滑桿或數字輸入框設定 0 至 360 度的角度,調整角度時預覽會即時更新。
相關工具
更新記錄
最後更新:2026-02-21
- 2026-02-21 初次發布