422
424

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

iOSアプリの画像サイズ

Last updated at Posted at 2015-01-07

iOSアプリを開発するときに必要な画像の仕様をまとめました。

  • アイコン
  • スプラッシュ
  • 各種UIBar

について記載しています。

その他の画像についてはこちらに記載しました。

なお、角丸半径については大まかな値ですので、 あくまで目安 としてお使いください。

#AppStore

スケール サイズ(px) 角丸半径(px) 画像名(例)
x1 512 x 512 112 iTunesArtwark
x2 1024 x 1024 225 iTunesArtwark@2x

#iPhone

##各種仕様

◯:対応 ×:非対応

端末 iOS 5 iOS 6 iOS 7 iOS 8 iOS 9 画面スケール ディスプレイ 解像度(px) 相対サイズ 画面密度(ppi)
~iPhone 3GS × × × x1 3.5 inch 320 x 480 320 x 480 163
iPhone 4 × × x2 3.5 inch Retina 640 x 960 320 x 480 326
iPhone 4s x2 3.5 inch Retina 640 x 960 320 x 480 326
iPhone 5 × x2 4.0 inch Retina 640 x 1136 320 x 568 326
iPhone 5c
iPhone 5s
× × x2 4.0 inch Retina 640 x 1136 320 x 568 326
iPhone 6 × × × x2 4.7 inch Retina 750 x 1334 375 x 667 326
iPhone 6 Plus × × × x3 5.5 inch Retina 1242 x 2208 414 x 736 401
iPhone 6s × × × × x2 4.7 inch Retina 750 x 1334 375 x 667 326
iPhone 6s Plus × × × × x3 5.5 inch Retina 1242 x 2208 414 x 736 401

##スプラッシュ

ディスプレイ サイズ(px) 画像名(例)
3.5 inch 320 x 480 Defaults
3.5 inch Retina 640 x 960 Defaults@2x
4.0 inch Retina 640 x 1136 Defaults-568h@2x
4.7 inch Retina 750 x 1334 Defaults-667h@2x
5.5 inch Retina Portrait 1242 x 2208 Defaults-736h@3x
5.5 inch Retina Landscape 2208 x 1242 Defaults-Landscape-736h@3x

##アイコン

###ホーム

iOS 7 以降

画面スケール サイズ(px) 角丸半径(px) 画像名(例)
x2 120 x 120 26 Icon-60@2x
x3 180 x 180 39 Icon-60@3x

iOS 6 以前

画面スケール サイズ(px) 角丸半径(px) 画像名(例)
x1 57 x 57 13 Icon-57
x2 114 x 114 25 Icon-57@2x

###設定

画面スケール サイズ(px) 角丸半径(px) 画像名(例)
x1 29 x 29 6 Icon-29
x2 58 x 58 13 Icon-29@2x
x3 87 x 87 18 Icon-29@3x

###Spotlight

iOS 7 以降

画面スケール サイズ(px) 角丸半径(px) 画像名(例)
x2 80 x 80 18 Icon-40@2x
x3 120 x 120 27 Icon-40@3x

iOS 6 以前

画面スケール サイズ(px) 角丸半径(px) 画像名(例)
x1 29 x 29 6 Icon-29
x2 58 x 58 13 Icon-29@2x

#iPad

##スプラッシュ

iOS 7 以降

向き 画面スケール サイズ(px)
Portrait x1 768 x 1024
Portrait x2 1536 x 2048
Landscape x1 1024 x 768
Landscape x2 2048 x 1536

iOS 6 以前

#####StatusBar表示

向き 画面スケール サイズ(px)
Portrait x1 768 x 1024
Portrait x2 1536 x 2048
Landscape x1 1024 x 768
Landscape x2 2048 x 1536

#####StatusBar非表示

向き 画面スケール サイズ(px)
Portrait x1 768 x 1004
Portrait x2 1536 x 2008
Landscape x1 1204 x 748
Landscape x2 2048 x 1496

##アイコン

###ホーム

iOS 7 以降

画面スケール サイズ(px) 角丸半径(px) 画像名(例)
x1 76 x 76 17 Icon-76
x2 152 x 152 33 Icon-76@2x

iOS 6 以前

画面スケール サイズ(px) 角丸半径(px) 画像名(例)
x1 72 x 72 16 Icon-72
x2 144 x 144 32 Icon-72@2x

###設定

画面スケール サイズ(px) 角丸半径(px) 画像名(例)
x1 29 x 29 6 Icon-29
x2 58 x 58 13 Icon-29@2x

###Spotlight

iOS 7 以降

画面スケール サイズ(px) 角丸半径(px) 画像名(例)
x1 40 x 40 9 Icon-80
x2 80 x 80 18 Icon-80@2x

iOS 6 以前

画面スケール サイズ(px) 角丸半径(px) 画像名(例)
x1 50 x 50 11 Icon-50
x2 100 x 100 22 Icon-50@2x

#各種UIBar

##高さ

コード上で使う相対サイズです

UIBar iPhone
(Portrait)
iPhone
(Landscape)
iPad
UIStatusBar 20 20 20
UINavigationBar 44 32 44
UIToolBar 44 32 44
UITabBar 49 49 49

##アイコンサイズ
多少サイズが違ってもちゃんと表示されるようです。
目安としてお使いください。

###UINavigationBar

画面スケール サイズ(px)
x1 22 x 22
x2 44 x 44
x3 66 x 66

###UIToolBar

画面スケール サイズ(px)
x1 22 x 22
x2 44 x 44
x3 66 x 66

###UITabBar

画面スケール サイズ(px) 最大サイズ(px)
x1 25 x 25 48 x 32
x2 50 x 50 96 x 64
x3 75 x 75 144 x 96

#リンク
[ios_developer]: https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/MobileHIG/IconMatrix.html#//apple_ref/doc/uid/TP40006556-CH27-SW1 "iOS Developer Library"

[iOS Developer Library : iOS Human Interface Guidelines : Icon and Image Design][ios_developer]

422
424
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
422
424

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?