Brand Colors, iPhone, Andriod and Apple Watch dimensions

Posted by on
 
iPhone Dimensions


iPhone X UI Dimensions



 

Refer:- http://www.kylejlarson.com/blog/iphone-6-screen-size-web-design-tips/ 


Refer: -http://click-labs.com/ios-8-design-cheat-sheet-and-free-iphone6plus-gui-psd/

Most of the photoshop mockup include 750/1334 px iPhone 6

iPhone X, iPhone 8 Plus, iPhone 7 Plus, and iPhone 6s Plus     @3x (eg:- 44 x 3 = 132px)
All other high-resolution iOS devices     @2x (eg:- 44 x 2=88px)

What is the navigation bar and toolbar icon sizes for iphone 6?
50px × 50px (25pt × 25pt @2x)

What is the tab bar icon sizes for iphone 6?
Circle=@2x: 50 x 50 px
Square=@2x: 46 x 46 px
Wide=@2x: 62px
Tall=@2x: 56 px

Refer:- https://developer.apple.com/ios/human-interface-guidelines/icons-and-images/custom-icons/

What is Retina Display?
Retina Display (marketed by Apple with a lowercase 'D' as Retina display) is a brand name used by Apple for its series of IPS panel and OLED displays that have a higher pixel density than traditional displays.





Loading...


Andriod Dimesions Info
==================
[ The conversion of dp units to screen pixels is simple: px = dp * (dpi / 160) ]

Google Nexus 5
1920 x 1080 px (640 x 360 dp) / xxhdpi / Normal screen
Portrait Details
===========
Navigation bar height-----------144 px (48 dp)
Title bar height-------------------144 px (48 dp)
Status bar height-----------------75 px (25 dp)
Content View--------------------1632 x 1080 px (544 x 360 dp)

Landscape Details
=============
Navigation bar width------------126 px (42 dp)
Title bar height-------------------120 px (40 dp)
Status bar height-----------------75 px (25 dp)
Content View---------------------885 x 1794 px (295 x 598 dp)

Note: For example, on a 240 dpi screen, 1 dp equals 1.5 physical pixels. You should always use dp units when defining your application's UI, to ensure proper display of your UI on screens with different densities.