Firefox Page Inspector
ExtensionFirefox's built-in inspector, known for its grid and subgrid overlays and its notes on why a CSS rule has no effect.
The Page Inspector in Firefox's built-in developer tools lets you examine and edit a page's HTML and CSS, either locally or on a remote target like Firefox for Android.
Its how-to guides cover dedicated CSS Grid and Flexbox inspectors, editing the box model, CSS filters and CSS shapes, inspecting colours, editing fonts, visualising transforms and working with animations.
A 3-pane mode splits the Rules view into its own pane so you can see the markup, rules and layout tools at once.
Good for
- Overlay and debug CSS Grid lines, areas and gaps
- See how flex items grow and shrink with the Flexbox inspector
- Edit clip-path shapes and filters on the page
- Inspect fonts actually used to render text
gridsubgrid
More extensions
See all →Web Developer extension
ExtensionA toolbar for Chrome, Firefox, Edge and Opera that can switch off styles, outline elements and show computed CSS.- Stars
- 846
- Last commit
- 2 years ago
- Licence
- GPL-3.0
Chrome DevTools
ExtensionThe built-in inspector for editing styles live, with editors for grid, flexbox, colours, shadows, easing and container queries.- Price
- Free
- Made by
- Kind
- Extension
