Mobile View With Chrome Inspect

The following tutorial will show you how to see the mobile view of a web page by using the "Inspect" feature of the Google Chrome browser.

Video Tutorial

Written Instructions

See Mobile View

1. Right-click any text on your web page within the Chrome web browser, select “Inspect.”
2. Click on icon that looks like a mobile phone and a tablet, found at top right of inspect window. This is “Toggle device toolbar.”
3. Change “Responsive” to iPhone 6/7/8 or desired device using the dropdown arrow at top left of the webpage.
4. Click the 3 vertical dots in the top right.
5. Then click “Show device frame.”

Change the Location of Inspect Window

1. On the top bar of the inspect window, click on the 3 vertical dots.
2. Select the “Dock side” that you prefer.

Close Chrome Inspect Window

1. Click on the "X" in the top right.

About Google Chrome Inspect

The inspect window provides a quick way to see what your web page looks like on a mobile device.

Using the Google Chrome inspect window is a go-to technique for web developers, designers, and content creators. The inspect window is also a great way to test changes to your web page in a safe environment.

Any changes you make to the page with the inspect window are temporary and seen only by you. Just refresh your page, and everything will be back to normal.