色彩與圖片分析工具

從任何圖片擷取主要色彩並建立調色盤、檢視 RGB 與亮度直方圖、預覽灰階,並檢查 WCAG 對比度以取得無障礙的配色。所有分析都在你的瀏覽器本機執行,無需上傳。

隱私優先:每張圖片都在你的瀏覽器中本機處理。任何內容都不會上傳、儲存或傳輸到任何伺服器。

PixelVault 的色彩與圖片分析工具能從任何圖片擷取調色盤、直方圖與對比資訊,完全在你的瀏覽器中完成。放入一張照片、插圖或螢幕截圖,立即取得它的主要色彩,以可複製的十六進位碼呈現,並附上每個顏色所占的比例。這是從你喜愛的圖片中拉出調色盤最快的方式,無需安裝任何東西,也不用上傳你的檔案。

從主要色彩,你可以產生互補、類比、三等分與單色的和諧配色以建立協調的方案,並把整個調色盤匯出成純 HEX、CSS 變數、SCSS 變數、JSON 或 Tailwind 設定檔——可直接貼進你的專案。若要更深入分析,RGB 與亮度直方圖能揭示曝光與色調平衡,灰階預覽會顯示圖片去除顏色後的樣貌,而 WCAG 對比檢查工具會告訴你一組文字與背景是否通過 AA 與 AAA 的無障礙標準。

運作原理

PixelVault 會以降低的解析度取樣圖片,並把相似的顏色分組以找出主要色彩,在色彩空間之間轉換以建立和諧配色,並讀取像素值以計算直方圖。對比度使用 WCAG 2.1 相對亮度公式。這一切都在你瀏覽器中已載入的像素上執行。

本機處理為何重要

在本機分析能讓你的圖片——客戶作品、未發布的設計、私密照片——不進入網路。沒有上傳,也沒有可能保留副本的伺服器,而且因為像素已經在頁面中,結果是即時的。

支援的格式

  • JPG — 直接分析。
  • PNG — 取樣顏色時尊重透明度。
  • WebP — 完整支援。

常見用途

  • 從照片或設計參考中擷取調色盤。
  • 為品牌或 UI 產生相搭配的配色方案。
  • 檢查文字與背景的對比是否符合無障礙標準。
  • 用 RGB 與亮度直方圖檢視曝光與色調。

常見問題

分析時我的圖片會被上傳嗎?
不會。色彩擷取、直方圖與對比檢查全都在你的瀏覽器本機執行。
我可以取得哪些色彩資訊?
主要色彩、可複製並附有十六進位碼與占比百分比的調色盤,以及完整的 RGB 與亮度直方圖。
對比檢查工具是做什麼用的?
它會測量兩個顏色之間的 WCAG 2.1 對比度,並顯示它們是否通過 AA、AA Large 與 AAA 的無障礙文字標準。
我可以複製色碼嗎?
可以。點選任一色票即可複製其十六進位碼,或一次複製整個調色盤。