All of the other developer tools we've gone over so far will also react to the device view. Play around with the other devices to see how the webpage and screen resolution changes. You can even toggle portrait and landscape views by clicking the little rotation icon at the end of the top menu. See what happens? Dragging the screen along the grid allows you to see how the webpage will change as the screen size changes. If you change the device preset to 'Responsive,' you can enlarge the view by dragging the right edge of the webpage emulation right. The webpage screen should shrink down to the device's size, and you can zoom in a bit by clicking the percentage dropdown next to the dimensions. Or, click the menu at the top to select default device sizes like Surface Duo or iPhone 12 Pro-let's go ahead and select the latter. Resize the small browser to see how things look if you were browsing on a tablet, phone, or even smaller screen. For now, let's see how to use the main Elements tab to tweak a webpage on your own. Web developer: Need to look for broken code, compare layouts, or make live edits to a page? Inspect Element does that, too.įor these and dozens of other use cases, Inspect Element is a handy tool to keep around. Support agent: Need a better way to tell developers what needs to be fixed on a site? Inspect Element lets you make a quick example change to show what you're talking about. Writer: Tired of blurring out your name and email in screenshots? With Inspect Element, you can change any text on a webpage in a second.

Marketer: Curious what keywords competitors use in their site headers, or want to see if your site's loading too slow for Google's PageSpeed test? Inspect Element can show both. Below are just a few reasons why different roles can benefit from learning this trick of the trade.ĭesigner: Want to preview how a site design would look on mobile? Or want to see how a different shade of green would look on a sign-up button? You can do both in seconds with Inspect Element. If you've never peeked at a website's code out of curiosity, you might wonder why you should learn how to use Inspect Element.

How does dot gmail trick work