Pixel Density

ピクセル密度は、ディスプレイの単位長さあたりの物理ピクセル数で、PPI（pixels per inch）で測定します。画面の解像度と物理的なサイズによって決まります。5120×2880ピクセルの27インチのディスプレイは、対角線が約5,874ピクセルあり、約218 PPIになります。

同じ視聴距離では、密度が高いほど文字や線が滑らかに見えます。画面上の要素を使いやすいサイズに保つため、OSは要素を拡大縮小します。macOSはインターフェースをポイント単位で測定し、標準のディスプレイでは1ポイントを1×1ピクセル、Retinaディスプレイでは2×2ピクセルで描画します。

Webでは、同じ比率をデバイスピクセル比と呼びます。CSSピクセル1つあたりの物理ピクセル数です。

ピクセル密度とディスプレイの鮮明さ

解像度が同じでも、サイズが異なる2つのディスプレイは、密度が異なります。1920×1080のパネルは、13インチでは鮮明に見えますが、27インチでは粗く見えます。密度だけで見え方が決まるわけではありません。視聴距離と拡大縮小の設定も影響します。

ピクセル密度がスクリーンショットに与える影響

スクリーンショットは物理ピクセルを記録します。2倍のRetinaディスプレイでは、1600×900ポイントの撮影範囲は3200×1800ピクセルの画像になります。同じ範囲を1倍の外部モニターで撮影すると、1600×900ピクセルになります。撮影のセッションがディスプレイの間で移動すると、一連の画像のサイズも変わります。

Temposhotは、撮影中にディスプレイの構成が変わると Display Configuration Changed のダイアログを表示します。このダイアログには Continue with Selected Display と Stop Capture があります。

デバイスピクセル比

デバイスピクセル比	例	幅400 CSSピクセルの要素
1	一般的なデスクトップのモニター	400ピクセル
2	MacのRetinaディスプレイ	800ピクセル
3	現在の多くのスマートフォン	1200ピクセル

ブラウザのツールやスクリーンショットのライブラリではデバイスピクセル比を設定できるため、デスクトップでもスマートフォンの密度の撮影ができます。

よくある間違い

• 1倍と2倍のスクリーンショットを1つのドキュメントに混在させ、一部がぼやけたり大きすぎたりする。
• ディスプレイのPPIと、画像に保存されたDPIの項目を混同する。
• 2倍のスクリーンショットを、Webページでピクセルのサイズそのままに表示する。
• 2倍の撮影を、正確に50％ではなく奇数の倍率で縮小する。

同じスクリーンショットを繰り返し撮りますか？

画像のサイズを一定に保つため、すべての撮影を同じディスプレイで行ってください。詳しくは macOSでのスクリーンショットの自動化 をご覧ください。

よくある質問

スクリーンショットのピクセルサイズを確認するには？

Screenshot Resolution Checker で開くか、Macではプレビューのインスペクタを使ってください。

ピクセル密度と解像度は同じものですか？

違います。解像度はピクセル数です。密度は物理的な画面の1インチあたりのピクセル数です。

出典

• Pixel density（Wikipedia）
• Window.devicePixelRatio（MDN）

関連リソース

• キャプチャの操作と復旧: 撮影中のディスプレイの変更。
• DPI: 印刷向けの解像度の値。