How test retina display on the chrome browser

How test retina display on the chrome browser


As we know that Retina Display (marketed by Apple with a stylized lowercase 'D' as Retina display) is a brand name used by Apple for screens that have a pixel density of around 300 PPI.[1] The term is used for several Apple products, including the iPhone, iPod Touch, iPad, MacBook Pro, iPad Mini, and iPad Air.[2] Because the typical viewing distance is different, depending on each device's use, the pixels per inch claimed to be of Retina quality can differ, depending on the size of the display, with higher PPI for smaller displays and lower PPI for larger displays: 326 PPI for the smallest devices (iPhone, iPod Touch, and iPad Mini (2nd generation)), 264 PPI for mid-sized devices (iPad (3rd & 4th generations), iPad Air), and 220 PPI for larger devices (MacBook Pro). Many other manufacturers' displays have similar or higher pixel density. When an Apple product has a Retina Display, each user interface widget is doubled in width and height to compensate for the smaller pixels. Apple calls this mode HiDPI mode.(en.wikipedia.org)

For some practitioners and website developers sometimes do not have this device for it certainly is in need once a simulator or emulator to try that retina display is applied in this application to work properly. 

Here are the steps to try to use the chrome browser 

  1. Open Chrome Browser and right click then click inspect element  
  2. In the bottom bar you will find some tabs that console, search, emulation and rendering 
  3. Click the tabs emulation, then pull up the bar tab as shown below 
  4. Adjust according to the menu on the left, adjust the device, screen etc. 


I think that's the easiest way to use chrome to see the retina display can work or not, please provide feedback and input on the comment form. Thank You

source img : https://lucatnt.com/wp-content/uploads/2013/07/retina_display___dock_icon_by_bladerahul-d502m24.jpg

Tidak ada komentar

Diberdayakan oleh Blogger.