色域檢查器
並排比较 sRGB、Display P3 和 Rec. 2020 色塊。在廣色域顯示器上，P3 和 Rec. 2020 色塊應明显比對應的 sRGB 更鲜艳。瀏覽器偵測是定性的，隻反映 CSS media query 支援，不代表你的 ICC 配置。
瀏覽器报告的色域
Primary gamut: …
Primary comparison (sRGB vs P3 vs Rec. 2020)
红色
绿色
Blue
青色
Magenta
Yellow
Chroma saturation test (sRGB vs P3)
If the right column looks identical 到 the left，your display 或 browser is likely clipping 到 sRGB. A wide-gamut panel should show richer reds，greens，和 cyans on the P3 side。
使用方法
- 在要測試的顯示器上開啟該工具。將房間調暗並直接查看面板以獲得最誠實的結果。
- 閱讀頂部的瀏覽器報告的色域面板 - 它顯示 CSS 是否偵測到 sRGB、Display P3 或 Rec。 2020 作為主色域，加上您的色彩深度。
- 捲動瀏覽主要比較行。在廣色域顯示器上，P3 和 Rec.每行中的 2020 色板看起來應該比旁邊的 sRGB 色板更生動。
- 檢查色度飽和度測試部分。如果 P3 列看起來與 sRGB 列相同，則您的顯示器或瀏覽器可能會裁切為 sRGB。
- 按一下任何樣本以將其全螢幕顯示，或使用預覽面板和全螢幕預覽按鈕進行全面板填充。
常見問题
什麼是色域測試？
色域測試可顯示您的顯示器是否可以呈現標準 sRGB 範圍以外的顏色。該工具在 sRGB、Display P3 和 Rec 中渲染相同的色調。 2020年並肩而行。如果廣色域版本看起來更豐富或更飽和，則您的面板可能顯示比 sRGB 更寬的色域。
什麼是顯示器 P3？
Display P3（也稱為 DCI-P3）是現代 Apple 裝置、許多 HDR 顯示器和高階筆記型電腦上使用的寬色彩空間。它比 sRGB 覆蓋的顏色大約多 25%，尤其是紅色和綠色。如果您的 MacBook 或廣色域顯示器工作正常，則此工具中的 P3 色塊看起來應該比 sRGB 更生動。
什麼是 Rec. 2020？
推薦。 2020 (BT.2020) 是專為 UHD 和 HDR 影片設計的超寬色彩空間。它比 Display P3 更大。大多數消費性顯示器無法完全顯示 Rec. 2020 年，但比較補丁仍然可以幫助您了解面板超出 sRGB 的程度。
為什麼 P3 和 sRGB 在我的顯示器上看起來一樣？
有多種原因可能導致此問題：您的顯示器可能僅支援 sRGB；作業系統可能強制使用 sRGB 模式；瀏覽器可以將所有內容合成為 sRGB；或者您的 GPU 驅動程式可能會限制輸出範圍。嘗試在 macOS 顯示設定、Windows HDR 設定或顯示器 OSD 中啟用廣色網域或 P3 模式，然後重新載入頁面。
這會讀取我的顯示器 ICC 配置檔案嗎？
不會。該工具使用 CSS 色域媒體查詢和渲染的色塊。它會報告瀏覽器對色域支援的看法以及您可以直接觀看的內容，而不是已安裝的 ICC 配置檔案的名稱或準確性。
瀏覽器報告的色域與我的顯示器規格相同嗎？
並非總是如此。頂部的徽章反映了 CSS 媒體查詢結果，這取決於瀏覽器、作業系統顏色管理和活動顯示。如果作業系統處於相容模式，以 100% DCI-P3 銷售的面板可能仍會在此處報告 sRGB。相信視覺斑塊比較是主要訊號。
這適用於 MacBook、iPhone 和 Android 嗎？
是的。任何支援 CSS Color Level 4 的現代瀏覽器（Safari、Chrome、Edge、Firefox）都可以渲染補丁。 Apple Silicon MacBook 和最新的 iPhone 通常在 sRGB 和 P3 之間表現出明顯的差異。許多配備 AMOLED 面板的 Android 手機也顯示出更寬的色域，儘管作業系統設定有所不同。
我可以用它來校準我的顯示器嗎？
它是一種定性診斷，非常適合確認廣色域是否處於活動狀態、發現顏色剪裁以及在購買前比較面板。為了獲得絕對的色彩準確性，您仍然需要硬體校準探頭和 ICC 配置檔案。
有東西上傳了嗎？
不會。所有色塊均在您的瀏覽器中本機渲染。沒有任何內容發送到伺服器。
介紹
此 線上色域檢查器 可讓您比較顯示器的渲染方式 sRGB、Display P3 和 Rec. 2020 並排顏色 — 免費，在瀏覽器中，無需安裝任何內容。它回答了一個僅靠規格表無法解決的問題：*我的顯示器實際上顯示的是廣色域顏色，還是所有內容都被剪輯為 sRGB？ *
當您編輯照片、對影片進行調色、為 Apple 裝置進行設計或購買宣傳為 DCI-P3 或 HDR 的新顯示器時，色域測試非常重要。只有當作業系統、GPU 和瀏覽器都向面板提供該色域時，諸如「100% DCI-P3」之類的行銷宣傳才有意義。這個工具可以讓差異在幾秒鐘內顯現出來。
如何執行色域測試
- 在要評估的顯示器上開啟工具。
- 閱讀瀏覽器報告的色域徽章 - 請注意哪個空間被標記為活動以及您的顏色深度。
- 瀏覽每個主要比較行（紅色、綠色、藍色、青色、洋紅色、黃色）。
- 比較每種色調的色度飽和度測試 - sRGB 列與 P3 列。
- 點擊任何樣本或使用 全螢幕預覽 用單個補丁填充整個面板。
查詢什麼
| Section | 健康的廣色域顯示器顯示了什麼 |
|---|---|
| 瀏覽器報告的色域 | 顯示 P3 或記錄。 2020 年標記為「活躍」（不僅僅是 sRGB）。 |
| 初步比較 | P3 和 Rec。同一行中 2020 年的色板看起來比 sRGB 更鮮豔，尤其是紅色和綠色。 |
| 色度飽和度測試 | P3 列明顯比 sRGB 豐富；紅色更深，綠色更霓虹，青色更亮。 |
| 色彩深度 | 30 位元或更高位元通常與廣色域工作流程相關，儘管 24 位元面板仍然可以是廣色域。 |
如果所有三列中的每一行看起來都相同，則您的顯示管道幾乎肯定已鎖定為 sRGB - 無論行銷手冊如何說。
了解色彩空間
sRGB 是網路、大多數辦公室顯示器和未標記影像的標準色彩空間。每個顯示器都可以顯示 sRGB；問題是它是否可以顯示更多。
Display P3 主要以紅色和綠色擴充 sRGB。您可以在 MacBook Pro 面板、iMac 顯示器、iPad 和 iPhone 螢幕以及許多支援 HDR 的桌面顯示器上找到它。針對 Apple 硬體的照片和影片工作流程通常使用 P3 作為工作空間。
建議。 2020 範圍更廣 — 專為超高清 HDR 廣播而設計。很少有消費者顯示器能夠覆蓋所有 Rec. 2020 年，但這裡的補丁仍然揭示了您的面板在 sRGB 之外還有多少淨空。
工具使用原生 CSS 顏色語法（rgb()、color(display-p3 …)、color(rec2020 …)）渲染每個空間，因此瀏覽器可以處理轉換和合成。您所看到的就是目前顯示管道所提供的。
常見用例
- 驗證新的廣色域顯示器 - 在返回視窗關閉之前確認 P3 色塊看起來更豐富。
- Mac 顏色設定故障排除 — 檢查 macOS Display P3 或 HDR 模式是否實際處於作用中狀態。
- 比較筆記型電腦面板 — 判斷 MacBook、Windows 超級本和遊戲顯示器的色彩鮮豔度。
- 購買前研究 — 在展廳地板上的顯示器上執行測試，以查看真實世界的色域行為。
- 照片和影片工作流程 — 確認您的編輯顯示不會默默地將飽和顏色剪切為 sRGB。
- 網頁設計 QA — 驗證 P3 CSS 顏色如何在廣色域硬體上為使用者呈現。
最佳實踐
- 調暗房間並直接觀看；環境光和視角會影響感知飽和度。
- 暫時停用夜班/藍光濾鏡 - 它們會改變色溫並掩蓋色域差異。
- 在指責面板之前檢查作業系統顯示設定：macOS「色彩設定檔」、Windows HDR 切換和顯示器 OSD 色域模式都很重要。
- 更改設定後重新載入 — 色域媒體查詢在頁面載入時更新。
- 將此與monitor color test、color range test和screen resolution test配對，以獲得完整的顯示診斷通道。
限制
這是視覺和瀏覽器等級檢查，而不是色度計測量。它無法報告覆蓋百分比（例如“97% DCI-P3”）或 delta-E 精度。為此，請使用硬體探針，例如 X-Rite 或 Calibrite 裝置。這裡的價值在於速度和可訪問性：任何人都可以在一分鐘內在任何設備上執行有意義的廣色域健全性檢查，而無需安裝軟體。