Firefox Developer Tools (macOS) keyboard shortcuts 

Firefox Developer Tools (macOS)  

Zeynel -
Yesterday
- Shortcuts
These shortcuts work in the main browser window to open the specified tool. The same shortcuts will work to close tools hosted in the Toolbox, if the tool is active. For tools like the Browser Console that open in a new window, you have to close the window to close the tool.
0
⌘ Cmd + ⌥ Opt + I

Open Toolbox (with the most recent tool activated)

0
⌘ Cmd + ⌥ Opt + I

Bring Toolbox to foreground (if the Toolbox is in a separate window and not in foreground)

0
or F12
0
⌘ Cmd + ⌥ Opt + I

Close Toolbox (if the Toolbox is in a separate window and in foreground)

0
or F12
0
⌘ Cmd + ⌥ Opt + K

Open Web Console

0
⌘ Cmd + ⌥ Opt + C

Toggle “Pick an element from the page” (opens the Toolbox and/or focus the Inspector tab)

0
↑  Shift + F7

Open Style Editor

0
↑  Shift + F5

Open Profiler

0
⌘ Cmd + ⌥ Opt + E

Open Network Monitor

0
⌘ Cmd + ⌥ Opt + M

Toggle Responsive Design Mode

0
⌘ Cmd + ⌥ Opt + J

Open Browser Console

0
⌘ Cmd + ⌥ Opt + ↑  Shift + I

Open Browser Toolbox

0
↑  Shift + F9

Storage Inspector

0
⌘ Cmd + ⌥ Opt + Z

Open Debugger

Advertisement

These shortcuts work whenever the toolbox is open, no matter which tool is active.
0
⌘ Cmd + ]

Cycle through tools left to right

0
⌘ Cmd + [

Cycle through tools right to left

0
F1

Toggle between active tool and settings.

0
⌘ Cmd + ↑  Shift + D

Toggle toolbox between the last 2 docking modes

0
Esc

Toggle split console (except if console is the currently selected tool)

These shortcuts work in all tools that are hosted in the toolbox:
0
⌘ Cmd + +

Increase font size

0
⌘ Cmd + -

Decrease font size

0
⌘ Cmd + 0

Reset font size

In the Editor Preferences section of the developer tools settings, you can choose to use Vim, Emacs, or Sublime Text key bindings instead.
To select these, visit about:config, select the setting devtools.editor.keymap, and assign “vim” or “emacs”, or “sublime” to that setting. If you do this, the selected bindings will be used for all the developer tools that use the source editor. You need to reopen the editor for the change to take effect.
0
⌘ Cmd + J then ⌘ Cmd + G

Go to line

0
⌘ Cmd + F

Find in file

0
⌘ Cmd + A

Select all

0
⌘ Cmd + X

Cut

0
⌘ Cmd + C

Copy

0
⌘ Cmd + V

Paste

0
⌘ Cmd + Z

Undo

0
⌘ Cmd + ↑  Shift + Z

Redo

0
or ⌘ Cmd + Y
0
Tab

Indent

0
↑  Shift + Tab

Unindent

0
Alt +

Move line(s) up

0
Alt +

Move line(s) down

0
⌘ Cmd + /

Comment/uncomment line(s)

0
⌘ Cmd + ↑  Shift + C

Inspect Element

0

Select the element under the mouse and cancel picker mode

0
↑  Shift +

Select the element under the mouse and stay in picker mode

These shortcuts work while you’re in the Inspector’s HTML pane.
0
Del

Delete the selected node

0
⌘ Cmd + Z

Undo delete of a node

0
⌘ Cmd + ↑  Shift + Z

Redo delete of a node

0
or ⌘ Cmd + Y
0

Move to next node (expanded nodes only)

0

Move to previous node

0
Home

Move to first node in the tree.

0
End

Move to last node in the tree.

Advertisement

0

Expand currently selected node

0

Collapse currently selected node

0
⤶ Enter

(When a node is selected) move inside the node so you can start stepping through attributes.

0
Tab

Step forward through the attributes of a node

0
↑  Shift + Tab

Step backward through the attributes of a node

0
⤶ Enter

(When an attribute is selected) start editing the attribute

0
H

Hide/show the selected node

0
⌘ Cmd + F

Focus on the search box in the HTML pane

0
F2

Edit as HTML

0
F2

Stop editing HTML

0
or ⌘ Cmd + ⤶ Enter
0
⌘ Cmd + C

Copy the selected node’s outer HTML

0
S

Scroll the selected node into view

0
⤶ Enter

Find the next match in the markup, when searching is active

0
↑  Shift + ⤶ Enter

Find the previous match in the markup, when searching is active

These shortcuts work when the breadcrumbs bar is focused.
0

Move to the previous element in the breadcrumbs bar

0

Move to the next element in the breadcrumbs bar

0
↑  Shift + Tab

Focus the HTML pane

0
Tab

Focus the CSS pane

These shortcuts work when you’re in the Inspector’s CSS panel
0
⌘ Cmd + F

Focus on the search box in the CSS pane

0
Esc

Clear search box content (only when the search box is focused, and content has been entered)

0
Tab

Step forward through properties and values

0
↑  Shift + Tab

Step backward through properties and values

0
⤶ Enter

or Space Start editing property or value (Rules view only, when a property or value is selected, but not already being edited)

0
  

Cycle up and down through auto-complete suggestions (Rules view only, when a property or value is being edited)

0
⤶ Enter

Choose current auto-complete suggestion (Rules view only, when a property or value is being edited)

0
or Tab
0

Increment selected value by 1

0

Decrement selected value by 1

0
Shift + Page Up

Increment selected value by 100

0
Shift + Page Down

Decrement selected value by 100

0
↑  Shift +

Increment selected value by 10

0
↑  Shift +

Decrement selected value by 10

0
Alt +

Increment selected value by 0.1

0
Alt +

Decrement selected value by 0.1

0
⤶ Enter

Show/hide more information about current property (Computed view only, when a property is selected)

0
or Space
0
F1

Open MDN reference page about current property (Computed view only, when a property is selected)

0
⤶ Enter

Open current CSS file in Style Editor (Computed view only, when more information is shown for a property and a CSS file reference is focused).

Keyboard shortcuts for the Firefox JavaScript Debugger.
0
⌘ Cmd + W

Close current file

0
⌘ Cmd + F

Search for a string in the current file

0
⌘ Cmd + ↑  Shift + F

Search for a string in all files

0
⌘ Cmd + G

Find next in the current file

0
⌘ Cmd + P

Search for scripts by name

0
F8

Resume execution when at a breakpoint

0
F10

Step over

0
F11

Step into

0
↑  Shift + F11

Step out

0
⌘ Cmd + B

Toggle breakpoint on the currently selected line

0
⌘ Cmd + ↑  Shift + B

Toggle conditional breakpoint on the currently selected line

Note: Before Firefox 66, the combination Ctrl + Shift + S on Windows and Linux or Cmd + Opt + S on macOS would open/close the Debugger. From Firefox 66 and later, this is no longer the case.
0
⌘ Cmd + ⌥ Opt + K

Open the Web Console

0
⌘ Cmd + F

Search in the message display pane

0
Ctrl +

Open the object inspector pane

0
Esc

Clear the object inspector pane

0
⌘ Cmd + ⌥ Opt + K

Focus on the command line

0
Ctrl + K

Clear output

0
Home

Scroll to start of console output (only if the command line is empty)

0
End

Scroll to end of console output (only if the command line is empty)

0
Page Up

Page up through console output

0
Page Down

Page down through console output

0

Go backward through command history

0

Go forward through command history

0
Ctrl + R

Initiate reverse search through command history/step backwards through matching commands

0
Ctrl + S

Step forward through matching command history (after initiating reverse search)

0
Ctrl + A

Move to the beginning of the line

0
Ctrl + E

Move to the end of the line

0
⤶ Enter

Execute the current expression

0
↑  Shift + ⤶ Enter

Add a new line, for entering multiline expressions

0
Tab

Choose the current autocomplete suggestion

0
Esc

Cancel the autocomplete popup

0

Move to the previous autocomplete suggestion

0

Move to the next autocomplete suggestion

0
Page Up

Page up through autocomplete suggestions

0
Page Down

Page down through autocomplete suggestions

0
Home

Scroll to start of autocomplete suggestions

0
End

Scroll to end of autocomplete suggestions

0
↑  Shift + F7

Open the Style Editor

0
⌘ Cmd + Space

Open autocomplete popup

0
⌘ Cmd + G

Find Next


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

Program information

Program name: Firefox Developer Tools (macOS) Firefox Developer Tools (macOS) (Developer tools)

Firefox Developer Tools is a built-in set of web development tools in the Firefox browser. It includes features like the Inspector, Console, Debugger, and Network Monitor, helping developers analyze and debug web pages efficiently.

Web page: mozilla.org/en-US/firefox/deve...

How easy to press shortcuts: 85%

More information >>

Shortcut count: 135

Platform detected: Windows and macOS mixed

Similar programs



Download Firefox Developer Tools (macOS)

Firefox Developer Tools (macOS) is available for download.

License: Open source

Go to download page

User operations

Add Firefox Developer Tools (macOS) to your list of favorites

Advertisement


What is your favorite Firefox Developer Tools (macOS) hotkey? Do you have any useful tips for it? Let other users know below.


Only registered users can post links.
Checking site status...
 
No comments yet. Ask, or type the first one!