How to see the mobile view of any website on a desktop
Most sites serve a different layout to phones. Here is how to see that mobile view on your computer, for your own site or anyone else's.
The built-in way
- Open the site in Chrome or Edge.
- Press F12 to open developer tools.
- Press Ctrl + Shift + M and choose a phone from the list at the top.
- Reload the page.
The reload matters: some sites decide between mobile and desktop on the server, using the browser's user agent, and only switch after a fresh load.
Why some sites look the same
- Not responsive. Older sites have one layout and simply shrink.
- Server-side mobile sites. They need the mobile user agent, which device mode sends after a reload.
- Cached pages. A hard reload (Ctrl + Shift + R) helps.
Seeing phone and desktop together
Developer tools show one size at a time. When you want the phone, tablet and desktop versions next to each other, an extension that layers several device sizes over the page is faster, especially when it keeps scrolling in sync.
Do it in one click with Ditto.
Ditto is a free Chrome and Edge extension that puts phones, tablets and desktop widths side by side over the page you are on, with scrolling, clicks and typing kept in sync. Nothing leaves your computer.
See Ditto
Ditto is a free Chrome and Edge extension that puts phones, tablets and desktop widths side by side over the page you are on, with scrolling, clicks and typing kept in sync. Nothing leaves your computer.
See Ditto