Chrome DevTools Keyboard Shortcuts for Developers

Keyboard shortcuts for opening DevTools

Windows / Linux	Mac	Description
Ctrl + Shift+ J	Cmd(⌘) + Option(⌥) + J	Open the Console panel
Ctrl + Shift + C	Cmd(⌘) + Shift + C or Cmd(⌘) + Option(⌥) + C	Open the Elements panel
F12 or Ctrl + Shift + I	Cmd(⌘) + Option(⌥) + I	Open whatever panel you used last

Global keyboard shortcuts

Windows / Linux	Mac	Description
Ctrl + ]	Cmd(⌘) + ]	Focus the next panel
Ctrl + [	Cmd(⌘) + [	Focus the previous panel
Ctrl + Shift + M	Cmd(⌘) + Shift + M	Toggle Device Mode
F5 or Ctrl + R	Cmd(⌘) + R	Normal Reload
Ctrl + F5 or Ctrl + Shift + R	Cmd(⌘) + Shift + R	Hard Reload
Ctrl + Shift + +	Cmd(⌘) + Shift + +	Zoom in
Ctrl + -	Cmd(⌘) + -	Zoom out
Ctrl + 0	Cmd(⌘) + 0	Restore default zoom level
Ctrl +Shift + P	Cmd(⌘) + Shift + P	Open the Command Menu
Ctrl + F	Cmd(⌘) + F	Search for text within the current panel. Supported only in the Elements, Console, Sources, Performance, Memory, JavaScript Profiler, and Quick Source panels.

Elements panel keyboard shortcuts

Windows / Linux	Mac	Description
Ctrl + Z	Cmd(⌘) + Z	Undo change
Ctrl + Y	Cmd(⌘) + Shift + Z	Redo change
Right Arrow(→)	Right Arrow(→)	Expand the currently-selected node. If the node is already expanded, this shortcut selects the element below it
Left arrow(←)	Left arrow(←)	Collapse the currently-selected node. If the node is already collapsed, this shortcut selects the element above it
Enter(↵)	Enter(↵)	Toggle Edit Attributes mode on the currently-selected element
H	H	Hide the currently-selected element
Function + F2	F2	Toggle Edit as HTML mode on the currently-selected element

Styles pane keyboard shortcuts

Windows / Linux	Mac	Description
Hold Ctrl then click the property value	Hold Cmd(⌘) then click the property value	Go to the line where a property value is declared
Hold Chift then click the Color Preview box next to the value	Hold Shift then click the Color Preview box next to the value	Cycle through the RBGA, HSLA, and Hex representations of a color value
Click a property name or value then press Tab(↹) or Shift + Tab(↹)	Click a property name or value then press Tab(↹)or Shift + Tab(↹)	Select the next / previous property or value
Click a value then press the Up Arrow(↑) or Down Arrow(↓)	Click a value then press the Up Arrow(↑) or Down Arrow(↓)	Increment / decrement a property value by 1
Click a value then press the Shift + Up Arrow(↑) or Shift + Down Arrow(↓)	Click a value then press the Shift + Up Arrow(↑) or Shift+ Down Arrow(↓)	Increment / decrement a property value by 10
Click a value then press the Ctrl + Up Arrow(↑) or Ctrl + Down Arrow(↓)	Click a value then press the Cmd(⌘) + Up Arrow(↑) or Cmd(⌘) + Down Arrow(↓)	Increment / decrement a property value by 100

Sources panel keyboard shortcuts

Windows / Linux	Mac	Description
F8 or Ctrl + \	F8 or Cmd(⌘) + \	Pause script execution (if currently running) or resume (if currently paused)
F10 or Ctrl + '	F10 or Cmd(⌘) + '	Step over next function call
F11 or Ctrl + ;	F11 or Cmd(⌘) + ;	Step into next function call
Shift + F11 or Ctrl + Shift + ;	Shift + F11 or Cmd(⌘) + Shift + ;	Step out of current function
Ctrl + S	Cmd(⌘) + S	Save changes to local modifications
Ctrl + Alt + S	Cmd(⌘) + Option(⌥) + S	Save all changes
Ctrl + G	Ctrl + G	Go to line
Alt + W	Option(⌥) + W	Close the active tab
Ctrl + Shift + Y	Cmd(⌘) + Shift + Y	Toggle the Navigation sidebar on the left
Ctrl + Shift + H	Cmd(⌘)+ Shift + H	Toggle the Debugger sidebar on the right

Code Editor keyboard shortcuts

Windows / Linux	Mac	Description
Ctrl + Delete(del)	Option(⌥) + Delete(del)	Delete all characters in the last word, up to the cursor
Ctrl + M	Ctrl + M	Go to matching bracket
Ctrl + B	Cmd + B	Add or remove a line-of-code breakpoint
Ctrl + D or Ctrl + U	Cmd + D or Cmd + U	Select / de-select the next occurrence of whatever word the cursor is on. Each occurrence is highlighted simultaneously
Ctrl + /	Cmd(⌘) + /	Toggle single-line comment. If multiple lines are selected, DevTools adds a comment to the start of each line

Network panel keyboard shortcuts

Windows / Linux	Mac	Description
Ctrl + E	Cmd(⌘) + E	Start/stop recording
Ctrl + R	Cmd(⌘) + R	Record a reload
R	R	Replay a selected XHR request
Escape(esc)	Escape(esc)	Hide the details of a selected request

Performance panel keyboard shortcuts

Windows / Linux	Mac	Description
Ctrl + E	Cmd(⌘) + E	Start/stop recording
Ctrl + S	Cmd(⌘) + S	Save recording
Ctrl + O	Cmd(⌘) + O	Load recording

Memory panel keyboard shortcuts

Windows / Linux	Mac	Description
Ctrl + E	Cmd(⌘)+ E	Start/stop recording

Console panel keyboard shortcuts

Windows / Linux	Mac	Description
Right Arrow(→) or Tab(↹)	Right Arrow(→) or Tab(↹)	Accept autocomplete suggestion
Escape(esc)	Escape(esc)	Reject autocomplete suggestion
Up Arrow(↑)	Up Arrow(↑)	Get previous statement
Down Arrow(↓)	Down Arrow(↓)	Get next statement
Ctrl + `	Ctrl + `	Focus the Console
Ctrl + L	Cmd(⌘) + K or Option(⌥) + L	Clear the Console

Search tab keyboard shortcuts

Windows / Linux	Mac	Description
Ctrl + Shift + { or Ctrl + Shift + }	Cmd(⌘) + Option(⌥) + { or Cmd(⌘) + Option(⌥) + }	Expand/collapse all search results