Chrome DevTools keyboard shortcuts

Chrome DevTools  

Zeynel -
6 years ago
- Shortcuts
1
F12

Open whatever panel you used last

1
or Ctrl + ↑  Shift + I
0
Ctrl + ↑  Shift + J

Open the Console panel

Advertisement

These shortcuts are available in most DevTools panels.
0
Ctrl + ]

Focus the next panel

0
Ctrl + [

Focus the previous panel

0
Ctrl + ↑  Shift + D

Switch back to whatever docking position you last used

0
Ctrl + ↑  Shift + M

Toggle Device Mode

0
Ctrl + ↑  Shift + C

Toggle Inspect Element mode

0
Ctrl + ↑  Shift + P

Open the Command Menu

0
Esc

Toggle the drawer

0
F5

Normal reload

0
Ctrl + F5

Hard reload

0
Ctrl + F

Search for text within the current panel

0
Ctrl + ↑  Shift + F

Open Search tab in the Drawer, which lets you search for text across all loaded resources

0
Ctrl + O

Open a file in the Sources panel

1
Ctrl + Y

Redo change

0
  

Select the element above / below the currently-selected element

0
H

Hide the currently selected element

1
↑  Shift + Tab

Use this shortcut after clicking property name or value to select the next / previous property or value

0
F8

Pause script execution or resume


Share this page on:
Is this page helpful?
0 0

Program information

Program name: Chrome DevTools Chrome DevTools (Developer tools)

Chrome DevTools are web debugging tools integrated to Google Chrome web browser. Those tools are used by web developers to access and ispect inner workings of a website, find issues, get ideas to optimize code etc.

Web page: developers.google.com

Last update: 11/11/2019 8:10 PM UTC

How easy to press shortcuts: 81%

More information >>

Shortcut count: 79

Platform detected: Windows or Linux


User operations

Add Chrome DevTools to your list of favorites

Advertisement


What is your favorite Chrome DevTools hotkey? Do you have any useful tips for it? Let other users know below.


 
No comments yet. Ask, or type the first one!