CSS 漸層生成器
可視化設計線性和徑向漸變，然後複製準備好的 CSS。所有內容在您的瀏覽器中即時更新。
如何製作 CSS 漸變
- 選擇線性或徑向，然後設置線性漸變的角度。
- 為您的停止選擇顏色，並設置每個位置從 0 到 100。
- 添加或移除停止以隨意塑造過渡。
- 將生成的 CSS 複製到您的樣式表或樣式屬性中。
常見問題
什麼是線性漸變？
線性漸變沿著您選擇的角度在直線上混合顏色，從 0 到 360 度。
什麼是徑向漸變？
徑向漸變從中心點向外混合顏色，形成圓形或橢圓形。
位置數字代表什麼？
每個位置是沿漸變的百分比，從開始的 0% 到結束的 100%。停止會自動按位置排序。
漸變在所有瀏覽器中都能正常工作嗎？
是的。生成的 CSS 使用每個現代瀏覽器都支持的標準 linear-gradient 和 radial-gradient 函數。
相關工具
為什麼使用漸變生成器？
使用 CSS 漸變生成器可視化設計平滑的顏色過渡，而不是在代碼中猜測值，並立即複製生產就緒的 CSS。
- 在調整顏色、角度和停止時即時查看漸變變化。
- 複製精確、有效的 CSS，而無需尋找語法錯誤。
- 在幾秒鐘內構建多停止的按鈕、橫幅和區域背景。
提示和限制
您可以添加任意多的顏色停止，生成器至少保留兩個，以確保漸變始終有效。停止在生成 CSS 之前會按位置排序。