2022-01-04
真っ赤を表現するなら、rgb(255,0,0) または #FF0000 というのは過去の話。
iPhone/iPad/Macでのより鮮やかな赤 color(display-p3 1 0 0) がありました。


hdr-testsrc on GitHub
iPhone/iPad/MacのSafariで見るとより鮮やかな色が右に見えます。左がRGBの最大値。右が Display P3 (DCI-P3) というより広域の色を表現できる色空間を使った最大値です。(参考、Appleが策定したスマホやPCの画面をもっと豊かな色合いで表現できる色空間「Display P3」とは? - GIGAZINE


Chromeなど非対応のブラウザで見ると表示できません。

以前から写真を加工前後での色の違いがなんとなく気になってましたが、原因はこれでした。
2022年のアプリづくり、色空間に気を使って、より鮮やかな表現を目指します。

HTML Canvasで使う場合、こんな書き方をするようです。(参考、Wide Gamut 2D Graphics using HTML Canvas | WebKit const g = canvas.getContext("2d", { colorSpace: "display-p3" }); // wide gamut color! HDRテレビで映える映像を生成したいところですが、上記Canvasはまだ各色8bit。
ただ、着々と仕様策定はW3Cにて進んでいるようで、実装が楽しみですね!
High Dynamic Range and Wide Gamut Color on the Web

Tweet
クリエイティブ・コモンズ・ライセンス
この作品は「Creative Commons — CC BY 4.0」の下に提供されています。
CC BY / @taisukef / アイコン画像 / プロフィール画像 / RSS