顏色工具

取色器：大方塊是當前色相下的飽和度-明度對映圖——從左到右飽和度遞增，從上到下明度遞減。在方塊任意位置點選即可取色。右側細長的豎條是色相滑塊（0° 到 360°）——拖動它改變基礎色相，方塊隨之重繪。右側顯示所取顏色的 HEX、RGB 和 HSL 三種格式——點選任意值即可複製。

調色盤：左側取色器和右側編輯框儲存的是同一個基準色——二者雙向同步（取色或輸入十六進位制值，兩邊互相更新）。下方五行調色盤全部由這個基準色繞色輪旋轉色相派生：互補色（色相 +180°，對比最強）、三角色（+120° / +240°，平衡三色）、四角色（+90° / +180° / +270°，矩形四色）、鄰近色（-30° / 基準 / +30° / +60°，和諧相鄰）和分裂互補色（+150° / +210°，比純互補柔和）。每行第一個色塊始終是基準色本身，其餘是它的色相旋轉變體。

格式轉換：輸入任意有效顏色——HEX（#3b82f6）、CSS 函式（rgb(59,130,246) / hsl(217,90%,60%)）或命名色（dodgerblue）——立即轉換到所有主流格式。格式下拉框可在自動檢測判斷錯誤時提示解析器。輸出顯示 HEX、RGB（0-255）、HSL（度, %, %）、HSV 和 CMYK。點選任意值即可複製。

色盲模擬：上傳圖片並選擇一種色覺障礙型別進行模擬。工具對每個畫素應用視錐響應矩陣變換，重新對映 RGB 值以近似不同型別色盲患者所看到的影像。左側畫布顯示原圖，右側顯示模擬效果。下拉框覆蓋三種二色覺型別（缺少一種視錐色素：紅色盲、綠色盲、藍色盲）、全色盲（無色覺），以及三種異常三色覺型別（視錐響應減弱）。低解析度圖片載入更快。

漸變：這是一個視覺化 CSS 漸變構建器。選擇線性（有方向）或徑向（從中心向外），設定角度（0° = 從下到上，90° = 從左到右），並定義色標。每個色標有一個取色器且均勻分佈（三個色標即 0%、50%、100%）。點選+ 色標可新增中間色點，構建更復雜的漸變。預覽即時更新，下方生成的 CSS 可直接複製。

對比度：用基於 sRGB 值的相對亮度公式（伽馬校正）計算前景文字與背景色之間的 WCAG 2.1 對比度比率。比率範圍從 1:1（相同顏色）到 21:1（黑與白）。結果顯示三個合規級別的通過/未通過：AA 普通文字（比率 ≥ 4.5:1）、AAA 大號文字（文字 ≥ 18pt 或粗體 ≥ 14pt 時比率 ≥ 4.5:1）和 AAA 普通文字（比率 ≥ 7:1）。調整顏色時示例文字預覽即時更新。

主色提取：上傳任意圖片，工具用顏色量化識別它的主色調色盤。圖片先縮小到 100×100 畫素，然後每個畫素被分入每通道 4 位的直方圖（R/G/B 各 16 級 = 4096 個桶）。透明畫素會被跳過。出現頻率最高的桶按畫素數排序，每個桶的中心色成為一個色塊。每個色塊顯示其 HEX 值和它所代表的畫素比例。調整數量滑塊（2-12）可控制提取的主色數量。

混合：在 RGB 色彩空間中以線性插值方式混合兩種顏色。比例滑塊決定混合結果：0% 是純顏色 1，100% 是純顏色 2，50% 是均等混合。R、G、B 每個通道獨立插值（例如紅 + 藍各 50% 得到紫色）。拖動滑塊或更改任一顏色時，結果預覽和 HEX/RGB 值即時更新。

色溫：用 Tanner Helland 近似演算法把開爾文黑體色溫轉換為對應的可見光顏色。低溫（1000-3000K）產生燭光、白熾燈那樣的暖橙紅色調；中段（4000-6500K）是中性白到日光；高溫（8000-40000K）偏移到陰天、深水那樣的冷藍色。下方標籤會識別每個溫度最接近的真實光源。

命名色：瀏覽80 箇中國傳統色（胭脂、硃砂、黛藍等——名稱取自中國古典文學、繪畫和染色傳統）與 140+ 個 CSS 命名色（標準網頁調色盤）的合併集合。用搜索框按名稱或 HEX 值過濾，或用下拉框在分類之間切換。點選任意色塊可檢視帶名稱和 HEX 程式碼的大預覽——點選程式碼即可複製。