P3 测试 — Display P3 自动检测
sRGB
Display P3
自动检测结果
P3 广色域
不支持
Rec.2020
不支持
色深
24 位
DPR
1
右列更鲜艳 = P3 生效；两列一致 = sRGB 链路
Features
专业级 P3 检测
专业级 P3 测试：加载即自动检测浏览器与屏幕的 P3 支持链路，6 个 P3 专属色块与 sRGB 并排，一眼见证广色域的差距。
加载自动检测
color-gamut 媒体查询 + 色深 + DPR 一屏尽览，P3 支持与否即时可知。
6 个 P3 专属色
炽红/苹果绿/影院橙/霓虹粉/玉青/紫罗兰——这些颜色在 sRGB 里根本不存在。
CSS 代码示例
附 fallback 与 @supports 标准写法，前端可直接抄作业启用 P3 色彩。
Concepts
Display P3 与 DCI-P3
DCI-P3
影院原教旨
数字影院投影标准，白点微绿（~6300K），γ2.6，为放映机环境设计。
Display P3
消费级改良
Apple 改良版：沿用 P3 色域但换用 D65 白点与 sRGB γ2.2 曲线，成为手机/显示器广色域事实标准。
浏览器支持
全链路支持
Safari 10+ / Chrome 111+ / Firefox 113+ 支持 color(display-p3)；macOS 默认全局 P3。
How to
三步验证 P3
01
看检测卡
页面自动报告 P3 / Rec.2020 / 色深 / DPR，P3「支持」即链路通畅。
02
对比六色
全屏对比左右两列：P3 屏右列显著更艳更「发光」，sRGB 屏两列无差异。
03
前端验证
开发者可用文末 CSS 片段在自己页面上实测 P3 渲染路径。
Compare
P3 生态支持一览
Apple 生态
全面- · iPhone 7 起全线 P3
- · Mac 全局色彩管理
- · 照片默认 P3
- · 体验最完整
安卓旗舰
普及中- · 旗舰 OLED 多支持
- · 系统管理不统一
- · 部分 App 过饱和
- · 看具体机型
Windows PC
追赶- · Win11 ACM 改善
- · 需显示器支持
- · 历史包袱重
- · Chrome 111+ 可用
内容生态
快速增长- · HDR 视频 P3 封装
- · 电影工业标准
- · 摄影 RAW 可输出
- · 网页渗透率低
Tips
优化建议
前端渐进增强
始终先写 sRGB 值再写 P3 值，老浏览器自动回退，新设备自然增强。
截图色域陷阱
macOS 截图保留 P3 色域，分享到 sRGB 设备会褪色——对外分享建议转 sRGB。
广色域照片导出
Lightroom 导出可选 Display P3，但发网络图务必转 sRGB 保兼容。
别滥用 P3
P3 适合照片、视频、品牌主色点缀；大面积 UI 用超饱和色反而刺眼廉价。
FAQ
常见问题
测试环境建议
- 最新版 Chrome/Safari
- macOS/iOS 体验最完整
- Windows 11 开 ACM
- 日常亮度档
- 避免强光直射
- 可双设备并排对比
Related
相关工具
设备指南
P3 支持情况纳入验机向导综合判定，一键串联全部检测。