Open Microsoft Edge DevTools

There are many ways to open Microsoft Edge DevTools, because different users want fast access to different parts of the DevTools UI.

Open the Elements panel to inspect the DOM or CSS

Each of the following tasks enable you to inspect the styles or attributes of a DOM node.

  • Hover on the element, open the contextual menu (right-click), and select Inspect.
  • Press Control+Shift+C (Windows) or Command+Option+C (macOS). For more information, see Microsoft Edge DevTools keyboard shortcuts.

The **Inspect** option

Open the Console panel

Each of the following tasks enable you to open the Console pane to view logged messages or run JavaScript.

Open the previous panel

To jump to the previous panel that you had open, press Control+Shift+I (Windows) or Command+Option+I (macOS). For more information, see Microsoft Edge DevTools keyboard shortcuts.

Open Microsoft Edge DevTools

Each of the following tasks enable you to open DevTools.

  • Use the following steps to open Microsoft Edge DevTools.

    1. Select the ... icon (the Settings and more icon).
    2. Select More Tools.
    3. Select Developer Tools.
  • To open Microsoft Edge DevTools, press F12 or Control+Shift+I (Windows) or Command+Option+I (macOS). For more information, see Microsoft Edge DevTools keyboard shortcuts.

Open DevTools from the Microsoft Edge main menu

Auto-open DevTools on every new tab

To auto-open DevTools on every new tab, open Microsoft Edge from the command-line and pass the --auto-open-devtools-for-tabs flag.

start msedge --auto-open-devtools-for-tabs

Note

Portions of this page are modifications based on work created and shared by Google and used according to terms described in the Creative Commons Attribution 4.0 International License.
The original page is found here and is authored by Kayce Basques (Technical Writer, Chrome DevTools & Lighthouse).

Creative Commons License
This work is licensed under a Creative Commons Attribution 4.0 International License.