配色方案產生器
使用免費線上產生器即時建立美麗和諧的配色方案。支援單色、類似色、互補色、三色、分裂互補和四色模式。透過HSL滑桿微調顏色，鎖定喜歡的顏色，匯出為CSS變數、Tailwind設定、JSON或SVG格式。100%瀏覽器運行，資料永不離開您的裝置。
如何產生配色方案？
點擊「生成」按鈕或按空格鍵建立新的隨機配色。使用和諧模式選擇器在單色、類似色、互補色、三色、分裂互補或四色配色方案之間切換。
如何鎖定喜歡的顏色？
點擊任意色卡上的鎖定圖示。鎖定後的顏色在產生新配色時將保持不變，而未鎖定的顏色將被替換。
如何匯出配色方案？
點擊「匯出」按鈕，選擇CSS變數、Tailwind設定、JSON陣列或SVG調色盤格式。配色方案將自動複製到剪貼簿。
不同的和諧模式有什麼區別？
單色模式使用同一色相，變化飽和度和亮度。類似色使用相鄰色相（±30°）。互補色使用對面色相（相隔180°）。三色使用3個等距色相（相隔120°）。分裂互補使用基礎色相加其補色兩側的色相。四色使用4個等距色相（相隔90°）。
可以圍繞我的品牌色來配色嗎？
可以。先用基準色選擇器挑好品牌色，再選一種和諧模式，其餘四個顏色就會圍繞它產生。之後還能用 HSL 滑桿逐一微調。
支援哪些匯出格式？
配色可以匯出為 CSS 變數、Tailwind 設定、JSON 陣列或 SVG 檔案。切換格式時程式碼預覽會立即更新，直接複製貼到專案裡就能用。
色值能以 HEX、RGB 還是 HSL 查看？
都可以，每個顏色的數值可在 HEX、RGB 和 HSL 之間切換，不必手動換算就能拿到設計工具或程式碼需要的格式。
每個顏色角落的小徽標是什麼意思？
它表示在該顏色上，白色還是黑色文字比較好讀。當對比達到 4.5:1 時徽標會顯示通過，符合 WCAG 無障礙建議——挑選按鈕或橫幅背景色時特別有用。
我的配色會被上傳到伺服器嗎？
不會。整個工具都在瀏覽器本機執行，顏色資料不會離開你的裝置。頁面載入完成後甚至離線也能繼續使用。
如何使用配色方案產生器
以單色、鄰近色、三角配色等模式產生和諧色盤，全部在瀏覽器本機計算。鎖定喜歡的色塊、微調後依你的框架格式匯出，資料不離開裝置。
- 在下拉選單中選擇配色 Mode：Random、Monochromatic、Analogous、Complementary、Triadic、Split-complementary 或 Tetradic。
- 設定 Base 顏色，讓每個產生的色塊都源自品牌色相，然後不斷重新產生直到滿意。
- 對不喜歡的色塊點 ✕ 移除後重擲；留下的色塊可用 HSL 滑桿繼續微調。
- 把色塊放到淺色和深色稿上對比，確認文字在每個顏色上都清楚可讀。
- 開啟 Export Palette，將配色匯出為 CSS Variables、Tailwind Config、JSON Array 或 SVG Palette。
在 Random 模式重新產生前先鎖定 Base 色塊，這樣探索的始終是品牌色周圍的變化，不會把它弄丟。
相關工具
- 顏色轉換器 免費線上顏色轉換器。即時轉換 HEX、RGB、HSL、HSV 格式，附視覺化拾色器。100% 隱私保護，瀏覽器本地運行。
- 顏色選擇器 使用瀏覽器吸管從螢幕任意位置取色，即時複製HEX、RGB、HSL顏色代碼。免費線上取色工具。
- 顏色對比度檢查器 檢查顏色對比度是否符合 WCAG 2.1 標準。即時驗證文字和 UI 元素的 AA 和 AAA 級別。
- 色盲模擬器 免費線上色盲模擬器。檢測設計在紅色盲、綠色盲、藍色盲等色覺缺陷下的效果。100%隱私保護，瀏覽器本地運行。
- GIF拆幀工具 從GIF動畫中提取並下載單幀為PNG或精靈圖。免費線上工具，支援預覽和ZIP匯出。
- GIF倒放 線上免費將GIF動畫倒序播放。上傳、預覽並即時下載倒放的GIF檔案。
- GIF變速工具 線上變更GIF動畫速度。即時加速或減速GIF檔案。
- 影片轉GIF 線上將影片轉換為動畫GIF，直接在瀏覽器中調整品質、幀率和解析度，無需上傳檔案。