Keyboard Shortcuts

There are several keyboard commands that boost productivity when working in Web Inspector.

Navigation Shortcuts

Action

Keyboard shortcut

Toggle Web Inspector

Command-Option-I

Toggle Console

Command-Option-C

Resources navigation sidebar

Control-1

Timelines navigation sidebar

Control-2

Debugger navigation sidebar

Control-3

Console

Control-4

Scope Chain details sidebar

Control-Shift-5

Style details sidebar

Control-Shift-4

Layer details sidebar

Control-Shift-3

Node details sidebar

Control-Shift-2

Resource details sidebar

Control-Shift-1

Show the previous view in the content browser

Command-Control-Left Arrow

Show the next view in the content browser

Command-Control-Right Arrow

DOM Tree Shortcuts

Action

Keyboard shortcut

Toggle selected element’s visibility

H

Console Shortcuts

Action

Keyboard shortcut

Toggle Console

Esc

Autocomplete

Tab

Previous Command

Up Arrow or Control-P

Next Command

Down Arrow or Control-N

Clear

Command-K or Control-L

Force Evaluation

Command-Return

Force Newline

Option-Return

Debugger Shortcuts

Action

Keyboard shortcut

Start Profiling JavaScript

Command-Option-Shift-P

Start Timeline Recording

Command-Option-Shift-T

Pause script execution

Command-Control-Y or Command-/

Step over

F6 or Command-’

Step into

F7 or Command-;

Step out

F8 or Command-Shift-;

Miscellaneous Shortcuts

Action

Keyboard shortcut

Reload page

Command-R

Reload page without cache

Command-Shift-R

Find

Command-F

Search entire Inspector

Command-Shift-F

Undo

Command-Z

Redo

Command-Shift-Z

Save file

Command-S

Increment number value by 10

Option-Shift-Up Arrow

Increment number value by 1 (or by 0.1 if the value is between -1 and 1)

Option-Up Arrow

Decrement number value by 1 (or by 0.1 if the value is between -1 and 1)

Option-Down Arrow

Decrement number value by 10

Option-Shift-Down Arrow