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.
Or press Command+Option+C (Mac) or Control+Shift+C (Windows, Linux, Chrome OS).
Press Command+Option+J (Mac) or Control+Shift+J (Windows, Linux, Chrome OS) to jump straight into the Console panel.
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 and then select More Tools > Developer Tools.
Auto-open DevTools on every new tab
Open Chrome from the command line and pass the
/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --auto-open-devtools-for-tabs
Was this page helpful?