画面解像度チェック

ディスプレイ情報ツールの使い方

ページを開くと、ブラウザーが把握している画面の情報をすべて読み取ります。画面解像度、ビューポートのサイズ、デバイスピクセル比、色深度、色域（sRGB、P3、Rec.2020）、HDR対応、画面の向き、アスペクト比、タッチポイント数、システムがダークモードを好むかどうかが表示されます。ブラウザーが許可していれば、複数のディスプレイも一覧に出ます。PPI計算機は、対角サイズ（インチ）を入力すると画素密度を求めます。

すべての値はブラウザーがローカルで読み取るもので、外部には送信されません。

結果の見方

• 画面解像度。 システムが報告するサイズです（例：1920×1080）。スケーリングを使っている場合は、実際のパネルの物理解像度より小さく表示されることがあります。
• ビューポート。 ブラウザーのウィンドウに表示されている領域のサイズで、単位はCSSピクセルです。ウィンドウのサイズや拡大率を変えると変化します。
• デバイスピクセル比（DPR）。 1つのCSSピクセルを、物理ピクセルいくつで表示するかを表す比率です。DPRが2なら、1920×1080のCSS領域に3840×2160の実ピクセルを使います。これがいわゆる「Retina」です。
• 色深度。 通常は24bitです。値が大きいほど、グラデーションが滑らかになります。
• 色域。 sRGBが標準です。P3とRec.2020はより広く、鮮やかな色を表示できます。
• PPI。 1インチあたりのピクセル数です。デスクトップのモニターは90〜110程度、ノートPCやスマホは220以上が一般的です。

CSSピクセルと物理ピクセルが異なるのは、高密度の画面でも文字が読みやすいように、OSがインターフェースを拡大しているためです。4Kモニターを拡大率200%で使うと、CSSピクセルでは1920×1080と報告されます。よくある解像度は、1366×768、1920×1080、2560×1440、3840×2160です。

解像度が合わないときの対処法

1. Windows。 設定 → システム → ディスプレイ を開き、モニターを選んで、ディスプレイの解像度 で推奨の解像度を選びます。文字が小さい場合は、拡大/縮小 を調整してください。
2. macOS。 システム設定 → ディスプレイ を開き、ディスプレイのデフォルト を選ぶか、別のサイズにするには スケール調整 を選びます。
3. Android。 機種によっては 設定 → ディスプレイ → 画面の解像度 で、スケーリングは 表示サイズとテキスト で調整します。
4. iPhoneとiPad。 解像度は固定です。サイズを変えるには 設定 → 画面表示と明るさ → 拡大表示 を使います。
5. グラフィックドライバーを更新する。 低い解像度しか選べない場合は、ドライバーを更新し、モニターのネイティブ解像度に対応したケーブルを使ってください。
6. ブラウザーの拡大率。 数値が妙な場合は、Ctrl+0（Macは Cmd+0）で拡大率をリセットしてください。拡大率を変えると、ビューポートとDPRが変わります。

ディスプレイ情報を確認する理由

実際の解像度とスケーリングが分かれば、壁紙の選択、ゲームや配信の設定、適切なモニターサイズの購入、箱に書かれたスペックとの比較に役立ちます。開発者はレスポンシブデザインのテストに使い、サポート担当者は、文字のぼやけや画面の表示が大きすぎる問題を調べる際に、これらの数値を尋ねます。

このページのスクリーンショットをサポート窓口やゲームのヘルプデスクに共有すれば、スケーリング、画面の向き、色の設定が原因かどうかが、すぐに分かります。

よくある質問