onHover — Developer Toolkit 作者: onHover

Stop switching tabs. Stop opening DevTools. Everything you need to inspect, debug, and analyze any webpage is one click away.

onHover is a developer toolkit that runs directly on any page — no DevTools, no context switching.

━━━ ELEMENT INSPECTOR ━━━
• Hover over any element to see computed styles, dimensions, and box model
• Click to pin a detail panel — drag it anywhere on screen
• Inspect elements inside iframes
• Edit styles and text live on the page
• Hide or remove elements without touching the source
• Check WCAG contrast ratio and accessibility attributes
• Export the inspected element directly to CodePen

━━━ COLOR TOOLS ━━━
• Eyedropper — pick any pixel color in HEX, RGB, or HSL
• Color Palette extractor — pull every color used on the current page
• One-click copy to clipboard

━━━ SCREENSHOTS & RECORDING ━━━
• Full-page screenshots (stitches content beyond the visible viewport)
• Capture a specific element or draw a custom area
• Record the active tab as video (with optional mic audio)
• Save screenshots and recordings directly to your device

━━━ SEO & META TOOLS ━━━
• Inspect all meta tags, Open Graph, and Twitter Card data
• Preview how the page looks in Google, Twitter, and LinkedIn
• Audit heading hierarchy (H1–H6)
• Scan all links and flag broken or redirected URLs
• Analyse semantic elements and structured data

━━━ PERFORMANCE & INSIGHTS ━━━
• Live Core Web Vitals badge (FCP, LCP, CLS, TTFB) on every page
• Full page insights: load time, resource breakdown, render-blocking assets
• Simulate network conditions: Fast 3G, Slow 3G, Offline

━━━ DEVELOPER DEBUGGING ━━━
• Console panel with network request log — no DevTools needed
• API Tester: send GET, POST, PUT, DELETE requests right from the extension
• Custom Code Injector: inject persistent CSS/JS into any site
• Clear browsing data (cache, cookies, localStorage) for any time range
• DOM Tree viewer for quick structure inspection
• Redirect Path tracer — follow every hop of a redirect chain

━━━ FORMATTERS ━━━
• Sitemap Formatter: opens any XML sitemap as a clean table with URLs, last-modified dates, and priority scores — instead of raw XML
• JSON Formatter: automatically beautifies JSON responses in the browser with syntax highlighting, collapsible nodes, and one-click copy

━━━ FONTS & ASSETS ━━━
• Font Inspector: detect every font on the page with computed styles
• Assets Viewer: browse, preview, and download all images, videos, SVGs, and PDFs

━━━ DATA EXTRACTION ━━━
• Table Capture: export any HTML table to CSV
• Email Finder: extract all email addresses from a page
• Webpage to Markdown: convert any page to clean Markdown

━━━ PRODUCTIVITY ━━━
• Cookie Editor: view, add, edit, and delete cookies
• Open Multiple URLs at once
• Site Stack: detect the tech stack, CMS, and frameworks a site uses
• Built-in todo list that persists across sessions

━━━ NO DEVTOOLS REQUIRED ━━━
Everything runs inside the extension popup or directly on the page — no DevTools panel, no terminal, no extra apps.

Works on all websites including localhost, staging environments, and sites behind authentication.