建立漸層
可輸入HEX、rgb()、hsl()或支援的CSS色名。不支援透明度。
線性漸層：2種顏色，角度90°。
輸入0到360的整數。0°向上、90°向右、180°向下、270°向左。
中間色位於0%或100%時，可能產生明顯的顏色分界。
正在準備編輯器。完成前顯示的值是固定範例。
使用方式
- 選擇兩種顏色。啟用3種顏色後，顯示順序為起始色、中間色與結束色。
- 選擇線性或放射狀。線性漸層可調整角度，3色漸層可調整中間色位置。
- 選取色標以複製色彩值，或複製CSS值、CSS宣告與分享連結。
支援的色彩格式
可輸入HEX、rgb()、hsl()或支援的CSS色名。不支援透明度。
使用3種顏色時，第二種顏色會成為中間色，第三種顏色則是結束色。
放射狀漸層以元素中心為圓心向外延伸，不使用角度設定。
將CSS宣告貼入樣式規則。漸層應使用background-image，而不是background-color。
HSL值經過四捨五入。如需保留精確的8位元色彩，請使用HEX。
請檢查文字覆蓋範圍內的所有背景色。只檢查兩端的顏色，無法判斷整個漸層的對比。
常見問題
支援哪些色彩格式？
支援HEX、rgb()、hsl()、部分常用CSS色名，以及37, 99, 235這類數值RGB三元組。不支援透明度、廣色域色彩函數，也不涵蓋所有CSS色名。
使用3種顏色會有什麼變化？
第一種顏色維持在0%，第二種成為指定位置的中間色，第三種則是100%的結束色。增加第三種顏色是讓漸層經過另一種顏色，不保證更平滑或更容易閱讀。
可以移動放射狀漸層的中心嗎？
這個版本固定使用以元素中心為圓心的圓形漸層。角度設定只適用於線性漸層。
分享連結會儲存什麼？
連結包含使用中的顏色、漸層類型、線性漸層的角度、3色漸層的中間位置，以及目前選取的色標。不儲存隱藏的草稿或編輯歷程，並會盡可能讀取舊版連結。
可以判斷漸層上文字的對比嗎？
此工具不提供對比判定。漸層的背景色會隨位置改變，因此只檢查兩端顏色並不足夠。請檢查文字覆蓋範圍內的實際背景。
可以匯出圖片或設計檔嗎？
不提供此功能。您可以複製CSS值、background-image宣告、各個色彩值及分享連結，但不能匯出PNG、SVG或設計檔。