DevTools Toolbox in Firefox 20

Mozilla developers have introduced a brand new interface for the DevTools in Firefox 20 nightly build. The newer interface combines various developer tools (like Web Console, JavaScript Debugger, DOM Inspector, Style Editor) to a unified dockable panel: Toolbox.

The Toolbox is aimed to integrate all DevTools components to a common interface, unlike the current configuration where components, like Style Editor, launch separately. The toolbox makes it easier to use many DevTools components on the same time.

firefox20-devtools-toolbox-2

firefox20-devtools-toolbox

The current toolbox interface integrates Page Inspector, Style Editor, Web Console, Debugger, Profiler, developer toolbar, 3D DOM viewer and launch buttons for responsive design mode & Scratchpad.

  (Thanks @PaulRouget)

Related: Per-window Private Browsing in Firefox 20