How to emulate a mobile device in a desktop browser (Chrome, Firefox, Opera, Edge, and Internet Explorer)

There are websites which offer more options and features when visited on mobile devices. When that happens, and you use a desktop browser, you get frustrated because of the limited user experience you get. Other times, you may want to test and see how a website looks on a particular mobile device like the iPhone, the iPad or a Pixel 2 smartphone. Here is how to view (and test) a mobile site on a desktop PC:

NOTE: This guide covers Google Chrome, Mozilla Firefox, Opera, Microsoft Edge, and Internet Explorer on Windows. Go to the section for the browser that interests you, to find the steps you need to go through.

How to activate the mobile browser emulator in Google Chrome

In Google Chrome, load the mobile website that you want to view. Then, click or tap the three vertical dots on the top-right corner. They are the button for "Customize and control Google Chrome." In the menu that opens, choose More tools and then "Developer tools." The developer tools open. To achieve the same result, you can also press the CTRL + Shift + I keys on your keyboard.

Google Chrome Developer Tools

Click or tap the "Toggle device toolbar" button (it is a small button that looks like a smartphone and a tablet near each other) or press CTRL + Shift + M on your keyboard. This activates the device toolbar where the mobile page is loaded. By default, the device toolbar uses a Responsive template for the page that you loaded. Click on it and choose the mobile device that you want to emulate: Samsung Galaxy S5, Pixel 2, Pixel 2 XL, iPhone (from version 5 to iPhone X), iPad and iPad Pro. The mobile page is reloaded as if you are using the smartphone or tablet that you have chosen from the list. It does not know that you are using a desktop computer.

Emulate mobile devices in Google Chrome

When you are done, press the X (Close) button in the top-right corner of Google Chrome's developer tools to get back to the standard desktop browsing mode.

How to activate the mobile browser emulator in Mozilla Firefox

In Mozilla Firefox, open the mobile page that you want to access as if you were using a mobile device. Then, click or tap the burger button on the top-right corner. It is named "Open menu."

In the menu that opens, choose Web Developer.

Mozilla Firefox - Web Developer tools

You see many options that are useful to developers. The one that interests you is "Responsive Design Mode." Click or tap on this option. This particular mode of viewing a web page is now loaded in Firefox. The same result can be achieved by pressing CTRL + Shift + M on your keyboard.

Mozilla Firefox: Responsive Design Mode

The Responsive Design Mode is enabled. In the center of the screen, you see the parameters used by this mode. If no device is selected, click or tap on the drop-down list with devices available for emulation and choose the one that you want to simulate: Samsung Galaxy S9, iPad, iPhone (from version 6 up to iPhone X), Kindle Fire HDX, and so on. The mobile page is reloaded as if it were loaded on the mobile device that you selected for emulation.

Emulating a mobile device in Mozilla Firefox

When you are done, press the X (Close Responsive Design Mode) button, to get back to the standard desktop browsing mode.

How to activate the mobile browser emulator in Opera

In Opera, load the mobile page that you want to view as if you were using a mobile device. Then click the Opera icon on the top-left. It is the "Customize and control Opera" button. In the menu that opens, choose Developer followed by Developer tools. The Developer tools are displayed on the right side of the browser window. The same result can be achieved by pressing the CTRL+Shift+I keys on your keyboard.

Opera Developer Tools

Then, click or tap the "Toggle device toolbar" button (it is a small button that looks like a smartphone and a tablet near each other) or press CTRL + Shift + M on your keyboard. This activates the device toolbar where your web page is loaded. Click on it and choose the mobile device that you want to emulate: Samsung Galaxy S5, Pixel 2, Pixel 2 XL, iPhone (from version 5 to iPhone X), iPad and iPad Pro. The mobile page is reloaded inside Opera, using the characteristics of the smartphone or tablet that you have chosen from the list.

Emulating a mobile device in Opera

When you are done, press the X (Close) button in the top-right corner of Opera's developer tools to get back to desktop browsing.

How to activate the mobile browser emulator in Microsoft Edge

In Microsoft Edge, load the site that you want to view as if you were using a mobile device. Then, click or tap the "Settings and more" button that is found on the top-right corner of the browser window. Its icon looks like three dots. If you are using Windows 10 October 2018 Update, go to "More tools" and then to "Developer Tools." If you are using Windows 10 April 2018 Update or older, choose F12 Developer Tools. The Developer Tools are opened on the bottom of the browser window. You can achieve the same result by pressing F12 on your keyboard, no matter how old or new your Windows 10 is.

Accessing the Developer Tools in Microsoft Edge

You see several tabs in the Developer Tools. If you see Emulation, click or tap on it. If you do not, click or tap the downwards arrow, and in the menu that opens, choose Emulation.

Microsoft Edge Developer Tools

Then, click or tap the Device drop-down list. You can choose to emulate the following devices: Lumia 650, Lumia 950, Lumia 950 XL, Surface Book, Surface Pro 4, iPad, iPad Mini, Nexus 5, Nexus 5X, and Nexus 6P.

Emulating a mobile device in Microsoft Edge

When you are done, press the X (Close) button in the top-right corner of Microsoft Edge's developer tools to get back to desktop browsing.

How to activate the mobile browser emulator in Internet Explorer

In Internet Explorer, to the mobile page that you want to view as if you were using a mobile device. Click the Tools button in the top-right corner or press ALT + X on your keyboard. Then, choose F12 Developer Tools. The Developer Tools are shown on the bottom of Internet Explorer. The same result can be achieved by pressing F12 on your keyboard.

Accessing the Developer Tools in Internet Explorer

Click or tap the Emulation tab and then the Browser drop-down list. Here you must select Windows Phone as your mobile device, and the web page is reloaded as if you were using a smartphone with Windows Phone. Unfortunately, Internet Explorer does not offer you the option to emulate Android smartphones or iPhones and iPads.

Emulating a mobile device in Internet Explorer

When you are done, press the X (Close) button in the top-right corner of the developer tools to get back to desktop browsing.

On which websites do you need to emulate a mobile device?

Now you know how to emulate all kinds of mobile devices in your favorite web browser. Before you close this tutorial, let us know which websites you need to use this emulation feature. We're very curious. Is it the (in)famous Instagram or some other mobile site?