画面解像度チェックとは？
画面解像度チェックは、いま見ている端末の画面解像度、ブラウザのウィンドウサイズ、ピクセル比（DPR）を表示するツールです。Webサイト制作でレスポンシブのブレークポイントを決めるとき、新しいモニターが本来の解像度で表示されているか確かめるとき、壁紙のサイズを選ぶときに便利です。
ブラウザが返す解像度は、OSの拡大縮小（スケーリング）設定が反映されたCSSピクセルです。実際のパネル解像度は、DPRを掛けた物理ピクセルで確認してください。
使い方
- ページを開くと、いちばん上にモニターの解像度が表示されます。
- 下の欄でブラウザのウィンドウサイズ、ピクセル比、物理ピクセルを確認します。
- ウィンドウのサイズを変えたりスマホを横向きにしたりすると、値がリアルタイムで変わります。
- すべての情報をコピーを押すと、すべての値をテキストでコピーして問い合わせや不具合報告に貼り付けられます。
解像度・ウィンドウサイズ・DPRの違い
| 項目 | 意味 |
|---|---|
| モニター解像度 | OSのスケーリングを反映した画面全体のサイズ（CSSピクセル） |
| 利用可能な領域 | タスクバー・Dock・メニューバーを除いたサイズ |
| ブラウザのウィンドウ | Webページが実際に表示される領域（レスポンシブの基準） |
| DPR | CSSピクセル1つあたりの物理ピクセル数 |
| 物理ピクセル | 解像度 × DPR。パネルの実際の画素数に近い値 |
たとえば4K（3840×2160）モニターをWindowsの拡大率150%で使うと、解像度は2560×1440、DPRは1.5と表示され、物理ピクセルは3840×2160になります。
よく使われる解像度
| 名称 | 解像度 | 比率 |
|---|---|---|
| フルHD（1080p） | 1920 × 1080 | 16:9 |
| WQHD（1440p） | 2560 × 1440 | 16:9 |
| 4K UHD | 3840 × 2160 | 16:9 |
| WUXGA | 1920 × 1200 | 16:10 |
| ウルトラワイドUWQHD | 3440 × 1440 | 21:9 |
よくある質問
4Kモニターなのに解像度が小さく表示されます。
OSの拡大縮小（Windowsの表示スケール、macOSの解像度設定）が適用されているためです。ブラウザは拡大率で割ったCSSピクセルを返すので、DPRを掛けた物理ピクセルを確認してください。
ブラウザをズームすると値は変わりますか？
はい。Ctrl（⌘）＋ホイールや＋/−でページを拡大・縮小すると、DPRとウィンドウサイズ（CSSピクセル）が一緒に変わります。正確な値を見るには倍率を100%に戻してください。
スマホの解像度がスペックより小さく表示されます。
スマホはDPRが2〜3倍なので、CSSピクセルでは小さく見えます。たとえば1179×2556の画面でDPRが3なら、393×852と表示されます。物理ピクセルの値がスペックに近いか確認してください。
測定した情報は保存・送信されますか？
いいえ。すべての値はブラウザが端末から直接読み取って表示するだけで、どこにも送信されません。