混色器

混合 按比例排列的兩個候選顏色,然後在將最終色彩移至文件、UI 標記或對比度檢查之前檢查 HEX/RGB/HSL 中的混合結果。

此頁面用於快速預覽數位色彩。它適合設計與規劃,不模擬真實顏料的混色。

其他語言 日本語 | English | 繁體中文 | 繁體中文(香港) | Italiano

混合兩種顏色

選擇兩種顏色並調整顏色 B 的比例,即可預覽混色結果及複製色碼。

適用於數位設計,不模擬真實顏料或油漆的混色效果。

可輸入 HEX、rgb()、hsl() 或支援的色名(如 red)。例如:#f00、rgb(255, 0, 0)、hsl(0, 100%, 50%)。

HEX 支援 3 位或 6 位數字。不支援 RGBA/HSLA、透明度及其他色彩空間。

顏色 A: 50% 顏色 B: 50%

選擇兩種顏色即可開始混色。

使用方式

  1. 選擇或輸入顏色 A 與 B,再按按鈕或 Enter 鍵套用各項數值。
  2. 設定顏色 B 的比例。交換 A 與 B 不會改變混色結果,也可恢復預設值。
  3. 套用所有編輯內容後,再複製色碼或分享網址。

使用混色結果

尋找單一顏色可使用顏色選擇器;以混色結果延伸配色可使用色票產生器;建立 CSS 漸層可使用CSS 漸層產生器;轉換格式可使用顏色轉換器;檢查可讀性可使用對比檢查器

常見問題

這個工具有什麼用途?

按比例混合兩種不透明顏色,並顯示 HEX、RGB 與 HSL。若結果與支援的 CSS 色名完全相符,也會顯示該色名。

使用什麼混色方式?

混色方式:將 sRGB 編碼後的 RGB 值按比例取平均,再四捨五入為 8 位元數值。這不是線性光或感知色彩空間的內插。黑白各佔 50% 時,結果為 #808080。

能模擬真實顏料或油漆的混色嗎?

不能。這是數位色彩預覽工具,不模擬顏料、塗料材質或照明造成的差異。

支援透明度或所有 CSS 色名嗎?

不支援透明度格式。支援 red、navy、lime、rebeccapurple 等 24 個常用色名,並非所有 CSS 色名。

分享網址會儲存什麼?

只儲存已套用的兩個 HEX 色碼及比例。請先套用編輯中的內容再分享。網址不包含無關參數或片段識別碼。