TakahiroNakamori

TakahiroNakamori

中森崇博(ナカモリタカヒロ)

スマホ・タブレットの解像度を調べる

【作成日】 2020年10月20日 11:02  【更新日】 

ブレイクポイントを決める時等、主なスマホやタブレットの解像度を調べる必要がある。しかし、ホームページのブレイクポイントを決める場合は、スマホはiPhone、タブレットはiPadの解像度を参考に決めても差し支えない場合が多い。そこで、iPhoneとiPadの解像度を整理すると、以下のようになる。

iPhone

互換や拡大モードを無視すると、解像度は以下の表で考えればいい。

機種名
画面サイズ
解像度(CSS用)
解像度(画像用)
5,5s,SE(初代)
4 inch
320 px × 568 px
640 px × 1,136 px
6,6s,7,8,SE(2代目)
4.7 inch
375 px × 667 px
750 px × 1,334 px
12 mini
5.4 inch
375 px × 812 px
1125 px × 2,436 px
6 Plus,6s Plus, 7 Plus, 8 Plus
5.5 inch
414 px × 736 px
1,080 px × 1,920 px
X,XS,11 Pro
5.8 inch
375 px × 812 px
1,125 px × 2,436 px
XR, 11
6.1 inch
414 px × 896 px
828 px × 1,792 px
12, 12 Pro
6.1 inch
390 px × 884 px
1170 px × 2,532 px
XS Max, 11 Pro Max
6.5 inch
414 px × 896 px
1,242 px × 2,688 px
12 Pro Max
6.7 inch
428 px × 926 px
1,284 px × 2,778 px

iPad

iPadの解像度が下表のとおり。Pro(12.9)を除くと大きな違いはなさそう。

機種名
画面サイズ
解像度(CSS用)
解像度(画像用)
mini
7.9 inch
768 px × 1,024 px
768 px × 1,024 px
mini 2, 3, 4, 5世代
7,9 inch
768 px × 1,024 px
1,536 px × 2,048 px
初代, 2
9.7 inch
768 px × 1,024 px
768 px × 1,024 px
3, 4, Air, Air 2, Pro(9.7)
9.7 inch
768 px × 1,024 px
1,536 px × 2,048 px
7世代
10.2 inch
810 px × 1,080 px
1,620 px × 2,160 px
Pro(10.5), Air(3世代)
10.5 inch
834 px × 1,112 px
1,668 px × 2,224 px
Air(4世代)
10.9 inch
820 px × 1,180 px
1,640 px × 2,360 px
Pro(11)
11.0 inch
834 px × 1,194 px
1,668 px × 2,388 px
Pro(12.9)
12.9 inch
1,024 px × 1,366 px
2,048 px × 2,732 px