---
title: Opening the Web Console
slug: Tools/Web_Console/Opening_the_Web_Console
translation_of: Tools/Web_Console/UI_Tour
---
<div>{{ToolsSidebar}}</div><p>To open the Web Console:</p>

<ul>
 <li>either select "Web Console" from the Web Developer submenu in the Firefox Menu (or Tools menu if you display the menu bar or are on Mac OS X)</li>
 <li>or press the <kbd>Ctrl</kbd><kbd>Shift</kbd><kbd>K</kbd> (<kbd>Command</kbd><kbd>Option</kbd><kbd>K</kbd> on OS X) keyboard shortcut.</li>
</ul>

<p>The <a href="https://developer.mozilla.org/en-US/docs/Tools/DevTools_Window" title="/en-US/docs/Tools/DevTools_Window">Toolbox</a> will appear at the bottom of the browser window, with the Web Console activated (it's just called "Console" in the <a href="/en-US/docs/Tools/DevTools_Window#Toolbar" title="/en-US/docs/Tools/DevTools_Window#Toolbar">DevTools toolbar</a>):</p>

<p><img alt="" src="https://mdn.mozillademos.org/files/11669/console.png" style="display: block; height: 324px; margin-left: auto; margin-right: auto; width: 952px;"></p>

<p>The Web Console's interface is split into three horizontal sections:</p>

<ul>
 <li><a href="/en-US/docs/Tools/Web_Console/Console_messages#Filtering_by_category" title="#filtering-and-searching">Toolbar</a>: along the top is a toolbar containing buttons with labels like "Net", "CSS", and "JS". This toolbar is used to filter which messages are displayed</li>
 <li><a href="/en-US/docs/Tools/Web_Console/The_command_line_interpreter" title="#command-line">Command Line</a>: along the bottom is a command line that you can use to enter JavaScript expressions</li>
 <li><a href="/en-US/docs/Tools/Web_Console/Console_messages" title="#message-display-pane">Message Display Pane</a>: in between the toolbar and the command line, and occupying most of the window, is the space in which the Web Console displays messages</li>
</ul>