P3色域テスト

このツールは役に立ちましたか?コメントを残したり、コツを共有したり、改善方法を教えてください。

このツールの機能

このツールは、カラーホイールの周りに均等に配置された12の色相にわたって、sRGBとDisplay P3をブラウザ内で直接比較し、単純な合格/不合格チェックではなく、ディスプレイが標準sRGBよりも実際にどの色をどれだけ広く表示するかを正確に確認できます。

仕組み

HSLカラーホイールの周りに30度間隔で12の色相が生成され、それぞれフル彩度と50%の明度で、その色相の最も鮮やかなsRGBバージョンが得られます。同じ3つの数値RGB値が、通常のrgb()の代わりにCSSのcolor(display-p3 ...)関数を使って再度レンダリングされるため、色はsRGBではなくDisplay P3のより広い原色に対して解釈されます。P3の赤と緑の原色はsRGBよりも外側にありますが、青の原色はほぼ同じであるため、2つの色空間で同一の数値を再利用すると、暖色系では顕著に彩度の高い結果が、青系ではほぼ同一の結果が得られ、抽象的に説明するのではなく、P3対sRGBの色域の違いの実際の形状を直接視覚化します。

解決できる問題

• P3がサポートされているかどうかだけでなく、広色域ディスプレイから最も恩恵を受ける色相を正確に確認する。
• 現在のブラウザとディスプレイの組み合わせでDisplay P3レンダリングが実際にアクティブであることを確認する。
• なぜ一部の色はP3画面で劇的に鮮やかに見えるのに、他はほとんど同じに見えるのかを理解する。
• 広色域ハードウェアに投資する前に、P3の利点が実際にどれほど大きいかについてのクイックな視覚的参照を得る。

よくある質問