Mobile View With Google Chrome

This article will guide you through simulating a mobile device view of a website using Google Chrome's Developer Tools.

Quick Links: | Instructions | Video Walkthrough | 

Instructions

1. Right-click anywhere on your webpage in Google Chrome and select Inspect from the menu. This opens the Developer Tools panel.
2. At the top left of the Developer Tools panel, click the mobile and tablet icon (next to the "Elements" tab). This is the Toggle device toolbar.
3. In the page preview area, locate the dropdown at the top center labeled Responsive. Use this dropdown to select your desired mobile device.
   
    
4. For a more realistic display, click the three vertical dots in the top right of the Developer Tools panel and select Show device frame. 
   
    
5. Your webpage should now appear scaled and framed to match the selected mobile device.
   
    

Video Walkthrough

See what a website looks like on a mobile phone while using your computer.

 

 Still need help? Contact IT Support Services for further assistance.
  
 Help us improve our Knowledge Base! Click Yes or No below, then let us know what worked — or what didn’t. Your feedback helps us improve our content and provide the best possible support.