PROJECT OVERVIEW
The Problem
goals
approach and tech stack
The extension was built using Chrome Extensions Platform (Manifest V3), with front-end scripting in JavaScript to traverse the DOM and compute visual properties. Overlays are rendered dynamically on the page without interfering with click actions. Layout computations use real-time element metrics and bounding boxes, and all processing runs locally to respect user privacy.
sneak peak
FINAL RESULT
Web Content Inspector delivers a lightweight, privacy-first tool that provides real-time visual insights into web pages. Users can activate or deactivate it with a click; it respects browsing flow, updates responsively as the page changes, and visualizes information developers normally extract through complex DevTools workflows. The extension streamlines design debugging and mobile layout checks while minimizing disruption to the browsing experience.
