Easy Ways to Inspect Element on Mac in Different Web Browsers

• In Safari, first enable the developer tool, then press "Cmd + Opt + I."
• In Chrome, press "Cmd + Opt + C."
• In Firefox, press "Cmd + Opt + I."

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.

Click the Advanced tab. It's to the far right of the window with gear icons.

Click to check the box next to "Show Develop menu in menu bar" Android 7 Checkbox. 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.

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. To close this window, click the X in the top left corner of the toolbar.

Chrome

Launch Chrome. Click the multicolored orb icon to launch Chrome.

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.

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.

Firefox

Open Firefox. Click the icon that looks like a fox encircling a purple-blue ball.

Navigate to the site you want to inspect. Go to the page with elements on it that you'd like to look at.

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.