The CSS Inspector extension outlines the elements on a page and displays their CSS properties when you hover over them.

Latest Version

Version

1.0.0

Update

March 11, 2024

Size

50.77KiB

Developer

CSS Inspector Extension

The \"CSS Inspector\" is a browser extension that provides a convenient way to inspect CSS properties of elements on a webpage. When you hover over an element, it outlines the element and displays its CSS properties. This can be particularly useful for web developers and designers who want to understand how a webpage is styled.

Here are some key features:

Element Outlining: The extension outlines elements on a webpage when you hover over them. This helps you visually identify the boundaries and positioning of the element.

Tag Property Display: It displays the HTML Tag properties of the hovered element. This can help you to identify the element itself.

Toggle On/Off: The extension can be easily toggled on and off. This means it won't interfere with your browsing when you don't need it.

Support for All URLs: The extension works on all URLs, making it a versatile tool for inspecting any webpage.

Source Manifest.json

{"update_url": "https://clients2.google.com/service/update2/crx", "manifest_version": 3, "name": "CSS Inspector", "description": "The CSS Inspector extension outlines the elements on a page and displays their CSS properties when you hover over them.", "version": "1.0.0", "icons": { "16": "CSSInspector_16x16.png", "32": "CSSInspector_32x32.png", "48": "CSSInspector_48x48.png", "128": "CSSInspector_128x128.png" }, "action": { "default_title": "CSS Inspector", "default_icon": { "16": "CSSInspector_16x16.png", "32": "CSSInspector_32x32.png", "48": "CSSInspector_48x48.png", "128": "CSSInspector_128x128.png" } }, "permissions": [ "activeTab", "scripting" ], "background": { "service_worker": "background.js" }, "web_accessible_resources": [ { "resources": [ "CSSInspector.min.css", "CSSInspector.min.js" ], "matches": [ "" ] } ]}

Download CRX(50.77KiB)