使用方法: 顏色混色器

顏色混色器 是一款免費線上顏色工具工具，可在瀏覽器中即時blend two colours in sRGB, HSL or perceptual CIE Lab and generate a ramp with contrast ratios。貼上資料、調整選項即可即時獲得結果——無需安裝、無需註冊，任何資料都不會上傳到伺服器。

立即使用 顏色混色器 →

說明

Blend two colours in sRGB, HSL or perceptual CIE Lab and generate a ramp with contrast ratios.

  • 顏色工具
  • 由於全部運算都在客戶端完成，使用 API 金鑰、權杖或私有記錄等敏感資料時，顏色混色器 同樣安全。
輸入 顏色混色器 輸出 100% 在瀏覽器內執行——資料不會離開您的裝置。
顏色混色器 — 輸入 → 輸出

使用方法

使用 顏色混色器 只需三步：

  1. 將資料貼上到輸入框（或載入範例）。
  2. 依目標格式或使用情境調整選項。
  3. 複製、下載或檢視輸出——輸入時結果即時更新。
使用方法 · 顏色混色器 1 將資料貼上到輸入框（或載入範例）。 2 依目標格式或使用情境調整選項。 3 複製、下載或檢視輸出——輸入時結果即時更新。
使用方法

執行

範例

Mix against #ffffff at 50% and switch the space to CIE Lab for a perceptually even ramp.

輸入

#0ea5b7

輸出

#0ea5b7 + #ffffff at 50% (mixed in RGB)

Result
  HEX   #87d2db
  RGB   rgb(135, 210, 219)
  HSL   hsl(186.4, 54.0%, 69.3%)

Contrast against white : 1.71:1
Contrast against black : 12.26:1

Ramp (9 steps)
    0%  #0ea5b7
   13%  #2cb0c0
   25%  #4abcc9
   38%  #68c7d2
   50%  #87d2db
   63%  #a5dde4
   75%  #c3e9ed
   88%  #e1f4f6
  100%  #ffffff

CSS
  --mix: #87d2db;
  background: linear-gradient(90deg, #0ea5b7, #ffffff);

此输出由工具真实运行产生，并非人工编写。

使用場景

顏色混色器 常見的使用情境：

  • Blend two colours in sRGB, HSL or perceptual CIE Lab and generate a ramp with contrast ratios.

參數說明

此工具沒有可設定參數，直接對輸入內容生效。

常見問題

什麼是 Color Mixer？

Color Mixer 用於blend two colours in sRGB, HSL or perceptual CIE Lab and generate a ramp with contrast ratios。它完全在瀏覽器內執行，資料保持私密。

Color Mixer 可以免費使用嗎？

可以。Color Mixer 免費、無次數限制，無需註冊或安裝。

我的資料會被上傳嗎？

不會。所有處理都在本機瀏覽器完成，不會傳送到任何伺服器。

注意事項

  • 全部计算在浏览器端完成，因此超大输入受限于标签页内存，而非服务器上传限制。

相關工具

十六進位顏色選擇器Interactive picker with HEX, RGB and HSL output.顏色 Code 轉換器Convert between HEX, RGB, HSL and named colors.顏色對比度檢查器(WCAG)Verify text contrast ratios against WCAG AA/AAA.顏色調色板產生器Shades, tints and complementary schemes from one color.隨機顏色產生器Batch random colors with copyable codes.CSS 命名顏色參考表All 148 CSS color names with codes and previews.

顏色混色器 → · 顏色工具 →

立即使用 顏色混色器 →