Outline every element on your website with the help of Laser Eyes
Laser Eyes Extension
An extension that aids Front-end Developers by visualizing elements in the DOM. Activating Laser Eyes will inject custom CSS onto the current tab, allowing developers to see how elements align and stack up. By using the CSS \"outline\" property, as opposed to \"border\", the elements won't grow in size and the original alignment is preserved. The CSS that Laser Eyes injects is customizable and synced across multiple browsers.
Read more
Source Manifest.json
{"update_url": "https://clients2.google.com/service/update2/crx",\t"name": "Laser Eyes",\t"description": "Outline every element on your website with the help of Laser Eyes",\t"version": "1.0",\t"manifest_version": 3,\t"icons": { \t\t"16": "img/16.png",\t\t"32": "img/32.png",\t\t"48": "img/48.png",\t\t"128": "img/128.png" \t},\t"action": {\t\t"default_icon": { \t\t\t"16": "img/16.png",\t\t\t"32": "img/32.png",\t\t\t"48": "img/48.png",\t\t\t"128": "img/128.png" \t\t}\t},\t"background": {\t\t"service_worker": "js/background.js"\t},\t"options_page": "options.html",\t"permissions": ["storage", "activeTab", "scripting"]}
Read more