Open Chrome DevTools

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

Open the Elements panel to inspect the DOM or CSS

When you want to inspect a DOM node's styles or attributes, right-click the element and select Inspect.

The Inspect option
Figure 1. The Inspect option

Or press Command+Option+C (Mac) or Control+Shift+C (Windows, Linux, Chrome OS).

See Get Started With Viewing And Changing CSS.

Open the Console panel to view logged messages or run JavaScript

Press Command+Option+J (Mac) or Control+Shift+J (Windows, Linux, Chrome OS) to jump straight into the Console panel.

See Get Started With The Console.

Open the last panel you had open

Press Command+Option+I (Mac) or Control+Shift+I.

Open DevTools from Chrome's main menu

Click Customize and control Google Chrome Customize and control Google Chrome and then select More Tools > Developer Tools.

Opening DevTools from Chrome's main menu.
Figure 2. Opening DevTools from Chrome's main menu

Auto-open DevTools on every new tab

Open Chrome from the command line and pass the --auto-open-devtools-for-tabs flag.

Mac:

/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --auto-open-devtools-for-tabs

Feedback

Was this page helpful?
Yes
What was the best thing about this page?
It helped me complete my goal(s)
Thank you for the feedback. If you have specific ideas on how to improve this page, please create an issue.
It had the information I needed
Thank you for the feedback. If you have specific ideas on how to improve this page, please create an issue.
It had accurate information
Thank you for the feedback. If you have specific ideas on how to improve this page, please create an issue.
It was easy to read
Thank you for the feedback. If you have specific ideas on how to improve this page, please create an issue.
Something else
Thank you for the feedback. If you have specific ideas on how to improve this page, please create an issue.
No
What was the worst thing about this page?
It didn't help me complete my goal(s)
Thank you for the feedback. If you have specific ideas on how to improve this page, please create an issue.
It was missing information I needed
Thank you for the feedback. If you have specific ideas on how to improve this page, please create an issue.
It had inaccurate information
Thank you for the feedback. If you have specific ideas on how to improve this page, please create an issue.
It was hard to read
Thank you for the feedback. If you have specific ideas on how to improve this page, please create an issue.
Something else
Thank you for the feedback. If you have specific ideas on how to improve this page, please create an issue.