如何製作漸層配色
輸入色碼或用取色器選好起始顏色和結束顏色，再決定中間要有幾個顏色，3到12個都可以。中間色是在模擬人眼視覺的色彩空間（OKLab）中計算的，所以每個顏色之間的落差看起來很平均，中間也不會出現髒髒的灰色。
漸層配色和連續漸層的差別
這個工具給你的是一個個獨立、附色碼的顏色，可以逐一使用：用在 Tailwind 色階、圖表、簡報或網站的各個區塊都很適合。如果你需要的是從一個顏色平順過渡到另一個顏色的背景，請使用 CSS 漸層產生器。
選好兩個顏色，再決定中間要有幾個顏色。可以逐一複製每個顏色，或把整組配色匯出成你需要的格式。
輸入色碼或用取色器選好起始顏色和結束顏色，再決定中間要有幾個顏色，3到12個都可以。中間色是在模擬人眼視覺的色彩空間（OKLab）中計算的，所以每個顏色之間的落差看起來很平均，中間也不會出現髒髒的灰色。
這個工具給你的是一個個獨立、附色碼的顏色，可以逐一使用：用在 Tailwind 色階、圖表、簡報或網站的各個區塊都很適合。如果你需要的是從一個顏色平順過渡到另一個顏色的背景，請使用 CSS 漸層產生器。
就是一組從一個顏色慢慢過渡到另一個顏色的顏色序列，例如從粉紅色到天藍色分成7個階段。每個顏色都有自己的 HEX 色碼，可以單獨使用。
3到12個。顏色少時，每一階的差異比較明顯；顏色多時，過渡更柔和，可選的色調也更多。
可匯出成附有現成漸層的 CSS 變數、HEX 色碼清單、Tailwind 設定、JSON、SVG 或 PNG 圖片。也可以在配色產生器中開啟，繼續編輯。
因為混色是在 OKLab 中計算的，這是依照人眼視覺設計的色彩空間。像粉紅和綠色這種對比色，直接用 RGB 混合會經過暗沉的顏色；在 OKLab 中，過渡會更乾淨、更平均。
可以。網頁網址會記住兩個顏色和顏色數量，複製網址傳給別人就行了。
漸層產生器做的是 CSS 的連續背景。這個工具則是把兩個顏色之間的顏色一個個拆出來，讓你可以逐一使用。
免費，不用註冊，也沒有使用限制。你可以按愛心收藏喜歡的漸層，收藏會保存在這個瀏覽器中。
我們使用 Google Analytics 的 Cookie 來了解網站的使用情況。你同意嗎？ 了解更多