Chrome DevTools Shortcuts
5 categories · 39 shortcuts
01
Opening DevTools
4 shortcuts- Open DevToolsF12windows
- Open DevToolsCtrl+Shift+Iwindows
- Open ConsoleCtrl+Shift+Jwindows
- Inspect ElementCtrl+Shift+Cwindows
02
Panel Navigation
5 shortcuts- Next panelCtrl+]windows
- Previous panelCtrl+[windows
- Toggle dock side (bottom/right)Ctrl+Shift+Dwindows
- Toggle drawerEsc
- Toggle device modeCtrl+Shift+Mwindows
03
Elements Panel
6 shortcuts- Navigate elementsUp/Down
- Collapse/Expand elementLeft/Right
- Edit attribute/textEnter
- Hide elementH
- Delete elementDelete
- UndoCtrl+Zwindows
04
Sources & Debugging
7 shortcuts- Search filesCtrl+Pwindows
- Go to lineCtrl+Gwindows
- Step overF10windows
- Step intoF11windows
- Step outShift+F11windows
- Continue / ResumeF8windows
- Toggle breakpointCtrl+F8windows
05
Console
6 shortcuts- Clear consoleCtrl+Lwindows
- Previous history entryUp
- Next history entryDown
- AutocompleteTab
- ExecuteEnter
- New line (multiline)Shift+Enter