Access developer tools in your browser


Developer toolbar of a Web browser is a very important component, not only for web developers but also for normal users. There are number of tweaks of your browser that can be accomplished only through developer tools.

Access developer tools in your browser

For example using youtube in Dark theme is possible only by a simple tweak through developer tools of Google chrome and Firefox. Hence it is very important to know how to acces the developer tools of all the major browsers in the market.

How to access developer tools on chrome?

Here are the steps to access the developer tools of Google chrome -

Step 1 :

Go to "Menu" - The menu icon with three dots in the top right corner of the page.

Access developer tools in chrome
Step 2 :

Go to "More Tools" in the menu that opens.

Access developer tools in chrome
Step 3 :

Click on "Developer Tools"

Access developer tools in chrome

 

Alternatively Use te Keyboard shortcuts to access Developer tools -

 

Cmd + Option + I on Mac

Ctrl + shift + I on Windows

How to access developer tools on Firefox?

Here are the steps to acces the developer tools of Mozilla Firefox -

Step 1 :

Click on the menu icon in the top right corner of the page.

Access developer tools in firefox
Step 2 :

Click on "Developer" option in the menu that opens.

Access developer tools in firefox
Step 3 :

Click on "Developer Toolbar" option.

Access developer tools in firefox
 

Alternatively Use te Key board shortcuts to access developer tools

Cmd + Option + K on Mac

Ctrl + shift + K on Windows

How to access developer tools on Opera?

Here are the steps to acces the developer tools of Opera -

Step 1 :

Click on "Menu" in the top left corner of the page.

Access developer toolson Opera
Step 2 :

Click on "More Tools" in the menu that opens.

Access developer toolson Opera
Step 3 :

Click on "Show Developer Menu".

Access developer toolson Opera

 

A new option "Developer" will be added to the Main menu.

 

Step 4 :

Click on "Developer".

Access developer toolson Opera
Step 5 :

Click on "Developer Tools".

Access developer toolson Opera


Alternatively Use te Key board shortcuts To access the developer tools.

Cmd + Option + I on Mac

Ctrl + shift + I on Windows

 

Access Developer tools on Edge

Use keyboard shortcut Fn+F12 to open Developer Tools on Microsoft Edge.

 

Note# You can’t access developer tools in the regular download of Safari.

 

Wrapping Up -

These are the steps to access the developer tools of all the major browsers of the market. It is a good habit to be in the know of how to use these tools.