iOS Icon Design: All Icon Sizes

本文详细介绍了iOS应用所需的各种图标尺寸及其用途,包括主屏幕图标、设置面板图标、Spotlight搜索图标等,并提供了针对不同设备分辨率的具体建议。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

Different Icons

We’ve already gone over the icon sizes of the home screen icon for iPhone and iPod and even taught you how to create one. It turns out, however, that iOS has a lot more optional icons than just the home screen icon.

In fact you can provide icons for the settings panel, if you offer a settings pane, a spotlight icon (for the search results) as well as a document icon and of course the huge icon for iTunes.

iOS Icon Sizes

IconSizeRadiiDevices
Homescreen57 x 57 pixels9 pixelsiPod
iPhone
iPhone 3G
iPhone 3GS
Homescreen High Res114 x 114 pixels18 pixelsiPod (retina)
iPhone 4
iPhone 4S
Homescreen iPad72 x 72 pixels11 pixelsiPad
iPad 2
iTunes512 x 512 pixelsnoneAll
Settings & Spotlight29 x 29 pixels5 pixelsiPod
iPhone
iPhone 3G
iPhone 3GS
iPad*
iPad 2*
Settings & Spotlight High Res58 x 58 pixels10 pixelsiPod (retina)
iPhone 4
iPhone 4S
Spotlight (iPad)50 x 50 pixels5 pixelsiPad
iPad 2
Document Icon22 x 29 pixelsnoneiPod
iPhone
iPhone 3G
iPhone 3GS
Document Icon High Res44 x 58 pixelsnoneiPod (retina)
iPhone 4
iPhone 4S
Document Icon iPad64 x 64 pixelsnoneiPad
iPad 2

iPod, iPhone, iPhone 3G & iPhone 3GS – Home Screen

57 x 57 pixels
Corner Radius: 9 pixels
This is the home screen icon for your application on the older devices. Despite the devices being older it is still wise to support these devices as iOS4 and iOS5, the two operating system you’re likely to support, still runs on iPhone 3GS and iPhone 3G runs iOS4.

iPod, iPhone 4 & iPhone 4S (retina) – Home Screen

114 x 114 pixels
Corner Radius: 18 pixels
This is the home screen icon displayed for your application on newer, retina enabled, devices including the new generation iPod Touch, iPhone 4 and iPhone 4S. The retina displays requires icons to be exactly twice as large as the icons for older devices as the pixel density is much greater.

iPad & iPad 2 – Home Screen

72 x 72 pixels
Corner Radius: 11 pixels
This is the home screen icon to be displayed for iPad applications. It is also worth mentioning that even if your application is not optimised for the iPad, still include an icon of this size as iPhone applications are able to run on iPads. Note: The iPad doesn’t currently support the retina display however this is much rumoured for the next iPad so take this into account when designing. If rumours are correct the next iPad screen will support icons 144 x 144 pixels.

iTunes

512 x 512 pixels
Corner Radius: none
This icon is used on the iTunes app store as well as the app section of iTunes. It is also the icon supplied to third party websites such as those that offer reviews of applications. 512 is the required size of the icon however iTunes scale this down in their store. Note: Apple recommend not adding or accommodating for corner radii as the icon is supplied to third parties without it.

iPod, iPhone, iPhone 3G, iPhone 3GS, iPad* & iPad 2* – Settings Pane & Spotlight Icon

29 x 29 pixels
Corner Radius: 5 pixels (unverified)
This icon is used as the icon for the settings pane in your iOS section if you use this, it is also used as the icon for your application when a user is shown results featuring your application. If you do not supply an icon iOS shrinks your application icon down which could cause distortion.
* Spotlight Icon excluded on iPad – separate icon should be defined

iPad & iPad 2 – Spotlight Icon

50 x 50 pixels
Corner Radius: 5 pixels (unverified)
This icon is used as your application icon when featured in spotlight search results. The Apple documentation does state that iOS will strip 1 pixel from each side resulting in a 48 x 48 pixel icon after rendering, take this into account when designing.

iPhone 4 & iPhone 4S – Settings Pane & Spotlight Icon

58 x 58 pixels
Corner Radius: 10 pixels (unverified)
This icon is used in the same way as the above settings and spotlight icon for iPhone and iPod but needs to be formatted for the larger displayed. If you fail to provide this icon your main icon will be shrunk down to fit.

iPod, iPhone, iPhone 3G & iPhone 3GS – Document Icon

22 x 29 pixels
If your application is able to open documents of s specific filetype you can specify an icon to be displayed before opening the document in your icon. A classic example its usage is in the Dropbox application, since iOS4 you have been able to open up a typically unsupported document in dropbox.

iPod, iPhone 4 & iPhone 4S – Document Icon

44 x 58 pixels
This is the same usage as above but a higher resolution for iOS devices supporting retina displays.

iPad & iPad 2 – Document Icon

64 x 64 pixels
A slightly different method for designing your document icon is employed for the iPad. I don’t want to go into detail on this so visit the user interface guidelines outlined by Apple here.

Phew…

Well as you can see your icon design isn’t as straight forward as you first thought. It involves a lot of work if you want your application to look perfect on every device and every function.

It’s worth mentioning that although there are a lot of iOS icons in different sizes and formats only 2 are required. You need an application icon as well as an iTunes icon, if you can leave out the rest and iOS will work some magic.

If you have any insight or resources you would care to share please post them in the comments.

原文地址


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值