User Interface Tour

To find your way around the Inspector, here’s aquick tour of the UI.

You can split the Rules view out into its own pane, separate from the other tabs on the CSS pane — this is called3-pane mode.

How to

To find out what you can do with the Inspector, see the following how to guides:

• Open the Inspector

• Examine and edit HTML

• Examine and edit the box model

• Inspect and select colors

• Reposition elements in the page

• Edit fonts

• Visualize transforms

• Select an element

• Examine and edit CSS

• Examine event listeners

• Work with animations

• Edit CSS filters

• Edit CSS shapes

• View background images

• Use the Inspector from the Web Console

• Examine CSS grid layouts

• Examine CSS flexbox layouts

• Use the Accessibility Inspector

Reference

• Keyboard shortcuts

• Settings