Developer tools are enabled by default on Google Chrome. Hotkeys can be used to open the tools. Press F12 on Windows or Option + ⌘ + I on Mac.
Otherwise, press the three vertically aligned dots in the top right corner of your Google Chrome window. Under the section "More Tools", you'll see the option to select Developer Tools which opens the toolkit in your window.
You can also access the tools by right-clicking the page and selecting "Inspect".
To enable developer tools on Safari, navigate to preferences.
Safari Menu > Preferences
Open the Advanced tab and check the box "Show Develop menu in menu bar".
Safari developer tools are now enabled. You can access these tools through the Develop menu or via hotkey. Web Inspector launches the main tab of the toolkit, but there's a dedicated selection for the console if needed.
If you'd like to use hotkeys, pressing Option + Shift + ⌘ + I opens Web Inspector and Option + ⌘ + C opens the console.
Microsoft Edge / Internet Explorer
Just like Google Chrome, developer tools are enabled by default. You can access them by pressing F12 or Ctrl + Shift + I.
The tools are similarly accessible by right-clicking a page and selecting Inspect.
If you'd like to access via the menu, click the three horizontal dots at the top right of the window. Navigate to "More tools" and select "Developer tools".
For Mac users:
To open developer tools, select View > Show Developer Menu.
A new sub-menu called Developer will appear on the menu bar. To use the tools, select Developer > Developer Tools.
For Windows and Linux users:
To open developer tools, go to O Menu > Developer > Developer Tools.
If your browser is not listed here or you require additional help, please read the respective documentation for your web browser.