Transcript
iPhone CHEAT SHEET iPhone 5
40pt
Carrier
88pt
8:08 AM
iPhone 6+
750x1134
1080x1920
@2x
@2x
@3x
4”
4.7”
5.5”
(Pixels Per Inch)
326 ppi
326 ppi
401 ppi
Contrast Ratio
800:1
1400:1
1300:1
Height of Status Bar
40 px
40 px
60 px
Status Bar
100%
Hamburger
iPhone 6
(5, 5C, 5S)
Edit
Resolution
Nav Bar
(Pixels)
20px Radius
Screen Size
(Diagonal)
Main Content Area
PPI
120px
@2x ex: iPhone 5
Height of Navigation Bar
Tab Bar
96pt
Height of Tab Bar
App Icons
App Store Icons
T
Radius
Resolution
Radius
120x120 px
20 px
1024x1024 px
180 px
120x120 px
20 px
1024x1024 px
180 px
Text
180x180 px
30 px
1024x1024 px
180 px
Text
Text
Bar Button Icons Text
selected 4px stroke
Segmented Control Label 1
Label 2
Label 3
Label 4
Label 5
*Minimum touchable area 44 x 44 points for each segment *Segmented control should have five or fewer segments www.techdew.com © / 2015-free to Use
88 px
88 px
132 px
120 x 120 80 x 80 80 x 80 Web clip
Settings
180 x 180 120 x 120 120 x 120
87 x 87 58 x 58 58 x 58
Icons
Newsstand
Toolbar and Navigation bar
1024 x 1024 1024 x 1024 1024 x 1024
66 x 66 44 x 44 44 x 44
Tab bar 96 px
96 px
144 px
Navigation Bar Title
34 px
34 px
48 px
Medium
Medium
Medium
Regular Buttons Label
34 px
34 px
48 px
Light
Light
Light
Table Header Label
34 px
34 px
48 px
Bold
Bold
Bold
Table Label
28 px
28 px
44 px
Regular
Regular
Regular
Tab Bar Icon Labels
22 px
22 px
30 px
Regular
Regular
Regular
75 x 75 50 x 50 50 x 50
Helvetica Neue Font
Resolution
Unselected 2px stroke
640x1136
Spotlight search results
*1 pt = 2 x 2 pixels on a regular retina display *In Retina, typography should have a minimum size of 22px *The optimal size for reading is around 32px
Font Usage DO
DON’T
Your Game
Your Game
Play Options Help
Play Options Help
*Text in a navigation controller uses the same font size that body style text uses for the large setting (specifically, 34 points) *Text always uses either regular or medium weight; it doesn’t use light or bold
Designed by Techdew Techdew UX Design & Consulting Firm