顯示器色域測試｜sRGB、Display P3 與 Rec.2020

目標色域

測試圖案

測試前確認使用原生解析度與 100% 瀏覽器縮放確認顯示器和工作流程使用正確的色彩描述檔關閉夜間模式與自動色彩增強使用支援 CSS Color 4 的現代瀏覽器並重新載入

偵測中

點擊畫面或使用左側全螢幕按鈕。

色塊差異記錄

比較同一列的 sRGB 參考與目標色域色塊。

漸層觀察記錄

觀察漸層是否平滑，以及是否出現斷層、色帶或裁切。

瀏覽器近似回報近似能力

瀏覽器近似回報偵測中選擇目標色域後開始測試。

color-gamut 只描述使用者代理程式與輸出裝置回報的近似範圍。色塊差異還會受到瀏覽器色彩管理、系統設定、顯示模式與內容映射影響；本頁不輸出色域覆蓋率或容積百分比。

如何解讀結果

先查看瀏覽器的近似回報，再切換色塊比較與漸層圖案。廣色域環境下目標色可能比 sRGB 參考更飽和；若看不出差異，也可能是瀏覽器、描述檔、顯示模式或面板限制。

工具使用 CSS 的 color-gamut 媒體特性與 CSS Color 4 的 color() 語法，檢查輸出路徑的近似支援並顯示測試色；它不是面板光譜測量。

網頁無法讀取顯示器原色座標、白點、亮度、色域覆蓋率或色域容積。需要百分比或硬體確認時，仍須使用測量儀器。

要怎麼測試顯示器是否支援 Display P3？

選擇 Display P3，查看瀏覽器回報，再用全螢幕比較 sRGB 與 P3 色塊。這是視覺篩查，不能證明實際覆蓋率。

瀏覽器回報支援色域，為什麼畫面看起來還是一樣？

即使輸出路徑支援，描述檔、顯示模式、面板和環境光也可能讓差異不明顯。

網頁可以測量色域覆蓋率百分比嗎？

不行。網頁拿不到面板原色座標與實測色度資料，因此不能可靠確認 P3 95% 或 sRGB 100% 之類的數值。

瀏覽器的 color-gamut 回報準確嗎？

它是瀏覽器與輸出路徑支援範圍的線索，不是面板覆蓋率、色域容積或色準的證明。

隱私與來源

設定與觀察記錄留在此瀏覽器，不會上傳；只有在你按下按鈕後才會使用複製功能。

圖案使用 CSS Color 4、color-gamut 與瀏覽器 Fullscreen API。