onHover — Developer Toolkit

Inspect elements, pick colors, capture screenshots, analyze SEO, and debug layouts — all without opening DevTools.

onHover is a lightweight developer toolkit that lives in your browser toolbar. It gives you instant access to the tools you reach for most — without the overhead of opening DevTools every time. Element Inspector Hover over any element to see its dimensions, computed styles, spacing, and CSS classes in real time. Click to pin a detailed panel. Edit content directly on the page, hide elements, and inspect inside iframes — all with a single keyboard shortcut. Color Picker Pick any color from any webpage. Instantly get the value in HEX, RGB, or HSL. Save your picked colors to a palette and copy with one click. Screenshot Capture Four capture modes in one place: Visible screen — capture exactly what you see Full page — automatically scrolls and stitches the entire page into one image Select element — click any element to capture just that Select area — drag to define a custom region After capturing, annotate, crop, and export directly from the built-in image editor. Screen Recorder Record your active tab as a video. Useful for documenting bugs, creating walkthroughs, or sharing UI reviews. SEO Analyzer Audit any page's metadata in one click — title, description, Open Graph tags, Twitter Card tags, canonical URLs, heading structure, link analysis, and semantic HTML tags. Core Web Vitals Badge Overlay a live performance badge on any page showing LCP, CLS, INP, and FCP in real time as you browse. Console + Network Panel A floating, always-on-top console and network log panel — see JS errors and network requests without switching to DevTools. Who is this for? Frontend developers, designers, QA engineers, and anyone who builds or reviews web pages regularly. onHover puts your most-used debugging tools a single click away. No account required. No data collection. Everything runs locally in your browser.