ディスプレイの色を厳密に調整するには、それなりのツールを使い、出力目的に応じたカラープロファイルを作る必要があります。PCであれば簡易的でもカラー調整する設定がありますが、スマートフォン、タブレット端末のディスプレイでは調整をする方法がありません。せめて、少し赤みがかっているとか、輝度が低めなど表示状態を確認できたらと思い、手頃なカラーチャートを作ってみました。出先のお客様環境でディスプレイを使ったプレゼンやプレビューする際、簡易チェックにも使えるかなとも思いまして。
このカラーチャートは、写真撮影現場で使われているカラーチャートをブラウザ内で再現したものです。
画像の場合、プロファイルに応じて各ブラウザでの表示に差違が生じます。ここでは純粋にブラウザでの表示差を確認するため、画像でなくHTMLの色指定でチャートを再現しました。(RGB値は「x-riteColorChecker(24)」で公開されている数値を使用しています)
| No. | Name | RGB | 16進法 |
|---|---|---|---|
| 1 | Dark Skin | 115, 82, 68 | #735244 |
| 2 | Light Skin | 194, 150, 130 | #c29682 |
| 3 | Blur Sky | 98, 122, 157 | #627a9d |
| 4 | Foliage | 87, 108, 67 | #576c43 |
| 5 | Blue Flower | 133, 128, 177 | #8580b1 |
| 6 | Bluish Green | 103, 189, 170 | #67bdaa |
| 7 | Orange | 214, 126, 44 | #d67e2c |
| 8 | Purplish Blue | 80, 91, 166 | #505ba6 |
| 9 | Moderate Red | 193, 90, 99 | #c15a63 |
| 10 | Purple | 94, 60, 108 | #5e3c6c |
| 11 | Yellow Green | 157, 188, 64 | #9dbc40 |
| 12 | Orange Yellow | 224, 163, 46 | #e0a32e |
| No. | Name | RGB | 16進法 |
|---|---|---|---|
| 13 | Blue | 56, 61, 150 | #383d96 |
| 14 | Green | 70, 148, 73 | #469449 |
| 15 | Red | 175, 54, 60 | #af363c |
| 16 | Yellow | 231, 199, 31 | #e7c71f |
| 17 | Magenta | 187, 86, 149 | #bb5695 |
| 18 | Cyan | 8, 133, 161 | #0885a1 |
| 19 | White | 243, 243, 242 | #f3f3f2 |
| 20 | Neutral 8 | 200, 200, 200 | #c8c8c8 |
| 21 | Neutral 6.5 | 160, 160, 160 | #a0a0a0 |
| 22 | Neutral 5 | 122, 122, 121 | #7a7a79 |
| 23 | Neutral 3.5 | 85, 85, 85 | #555555 |
| 24 | Black | 52, 52, 52 | #343434 |
| 枠 | RGB Black | 0, 0, 0 | #000000 |