Download Article
Download Article
This article was reviewed by Stan Kats and by wikiHow staff writer, Darlene Antonelli, MA. Stan Kats is a Professional Technologist and the COO and Chief Technologist for The STG IT Consulting Group in West Hollywood, California. Stan provides comprehensive technology solutions to businesses through managed IT services, and for individuals through his consumer service business, Stan's Tech Garage. Stan holds a BA in International Relations from The University of Southern California. He began his career working in the Fortune 500 IT world. Stan founded his companies to offer an enterprise-level of expertise for small businesses and individuals.
This article has been fact-checked, ensuring the accuracy of any cited facts and confirming the authority of its sources.
This article has been viewed 5,920 times.
Is there a box or element on a page that you want to inspect? If you're on a Mac, inspecting elements is easy, no matter which browser you're using! This wikiHow article teaches you how to inspect elements on Mac using different web browsers.
Things You Should Know
- In Safari, first enable the developer tool, then press "Cmd + Opt + I."
- In Chrome, press "Cmd + Opt + C."
- In Firefox, press "Cmd + Opt + I."
Steps
Safari
Download Article
-
![Step 1 Open Preferences or Settings in Safari.]()
Open Preferences or Settings in Safari. Once you launch Safari (the app icon looks like a blue compass with a red and white needle), click Safari in the Apple menu and choose Preferences or Settings, depending on your version of macOS.- You first have to enable the "Inspect Element" tool before you can use it in Safari.
-
![Step 2 Click the Advanced tab.]()
Click the Advanced tab. It's to the far right of the window with gear icons.Advertisement -
![Step 3 Click to check the box next to "Show Develop menu in menu bar" icon.]()
Click to check the box next to "Show Develop menu in menu bar". Once the box shows a checkmark, you're able to continue to the next step! If this box is already checked, don't uncheck it.
-
![Step 4 Inspect a page.]()
Inspect a page. Go to a page with an element you want to inspect, then inspect it three ways:- Go to Develop > Show Web Inspector OR
- Right-click or ctrl-click the page and click Inspect Element from the drop-down menu OR
- Press Cmd + Opt + I on your keyboard.[1]
- To close this window, click the X in the top left corner of the toolbar.
Chrome
Download Article
-
![Step 1 Launch Chrome.]()
Launch Chrome. Click the multicolored orb icon to launch Chrome. -
![Step 2 Navigate to the site you want to inspect.]()
Navigate to the site you want to inspect. Use the address bar to go to the page with elements that you want to look at. -
![Step 3 Inspect the page.]()
Inspect the page. You can do this in a few different ways:- Right-click or ctrl-click the page and select Inspect OR
- Press Cmd + Opt + C.
- When you're done, close the Web Inspector window by clicking the small X in the toolbar.[2]
Firefox
Download Article
-
![Step 1 Open Firefox.]()
Open Firefox. Click the icon that looks like a fox encircling a purple-blue ball. -
![Step 2 Navigate to the site you want to inspect.]()
Navigate to the site you want to inspect. Go to the page with elements on it that you'd like to look at. -
![Step 3 Inspect the page.]()
Inspect the page. You can do this in a few different ways:- Right-click or ctrl-click the page and select Inspect OR
- Press Cmd + Opt + I.
- When you're done, close the Web Inspector window by clicking the small X in the toolbar or press Cmd + Opt + I again.[3]
Expert Q&A
Tips
References
About This Article
