Device emulation
In the Edge DevTools: Browser tab, the Device Emulation toolbar on the bottom enables you to simulate different environments:
To reproduce the UI shown here, see Opening DevTools by right-clicking an HTML file in Opening DevTools and the DevTools browser.
See also:
- Limitations of the embedded DevTools browser in Using an external browser window.
Emulate Devices dropdown menu
In the Emulate devices dropdown menu, you can select from a number of different devices, or the default option of Responsive. When you select a device, the viewport resizes to the correct measurements and simulates the touch interface. For example, there are several emulated iPhone layouts:
Width and Height dropdown menus
To change the viewport dimensions, click the Width and Height 
dropdown menus:
Rotate button
Click the Rotate button (
) to rotate the viewport between portrait and landscape orientation:
Emulate CSS Media Features button
Use the Emulate CSS media features button (
) to:
- Emulate CSS media queries.
- Test how your product looks in print mode.
- Switch between dark and light mode.
- Emulate forced colors.
Emulate Vision Deficiencies button
Click the Emulate vision deficiencies (
) button to test the user experience of the current webpage with different visual deficiencies. This button lets you test your product in a blurred mode, or in different color deficiencies:
