30 Firebug Keyboard Shortcuts

Learn all the tools that a web designer would need to analyze, debug, edit, and monitor CSS, HTML, DOM, or JavaScript on any website with Firebug Shortcuts.

Firebug provides numerous keyboard shortcuts to make working with it easier and faster. As you become familiar with Firebug shortcuts, you’ll find yourself using them more and more instead of relying on the mouse. Download the Firebug Shortcuts list for Windows and Mac users in PDF format.

Managing Firebug Shortcuts

ActionFirebug Shortcuts WindowsFirebug Shortcuts Mac
Open and close Firebug PanelF12F12
Open Firebug in the windowCtrl + F12Command + F12
Toggle Inspect ModeCtrl + Shift + CCommand + Shift + C
Focus Command LineCtrl + Shift + LCommand + Shift + L
Focus Search BoxCtrl + Shift + KCommand + Shift + K
Firebug Help PageF1F1

HTML Panel Shortcuts

ActionFirebug Shortcut keys WindowsFirebug Shortcuts Mac
One line downDown Arrow keyDown Arrow key
One line upUp Arrow keyUp Arrow key
One Node upCtrl + Down Arrow keyCommand + Down Arrow key
One Node downCtrl + Up Arrow keyCommand + Up Arrow key
Collapse current nodeLeft Arrow keyLeft Arrow key
Expand current nodeRight Arrow keyRight Arrow key

CSS Panel Shortcuts

ActionFirebug Shortcut keys WindowsFirebug Shortcut keys Mac
Jump to the next fieldTabTab
Jump to the previous fieldShift + TabShift + Tab
Increase the number by 1Up Arrow keyUp Arrow key
Decrease the number by 1Down Arrow keyDown Arrow key
Increase the number by 10Page Up keyPage Up key
Decrease the number by 10Page Down keyPage Down key
Finish editingEnter keyReturn key
Cancel EditingEscEsc

Script Panel Shortcuts

ActionFirebug Shortcut keys WindowsFirebug Shortcut keys Mac
ContinueF8F8
Step OverF10F10
Step IntoF11F11
Step OutShift + F11Shift + F11
Next function on the stackCtrl + .Command + .
Previous function on the stackCtrl + ,Command + ,
Focus Scripts Location MenuCtrl + SpacebarCommand + Spacebar
Focus Watch Side PanelCtrl + Shift + NCommand + Shift + N

The task of finding a replacement for Firebug, which was once freely available with a package, has become even more challenging. Every web browser has its own set of developer tools as well. Just as Mozilla has Firebug, the Google Chrome web browser has its own set of developer tools, and the Opera web browser offers the Dragonfly tool.

READ NEXT:

Back to top button