Debugify

Inspect, edit, capture, audit, and optimize any website from one side panel.

Debugify is the ultimate all-in-one web development, debugging, and analysis suite - built entirely into a native Chrome Side Panel. Forget juggling a dozen different browser extensions. Debugify brings everything you need to build, test, and audit websites into one beautiful, unified workflow that stays out of your way until you need it. 🎁 7-DAY UNLIMITED FREE TRIAL Install Debugify today and get 7 days of full, unrestricted access to every single Pro feature. No credit card required to start! After the trial, you can continue using the core tools for free forever, or upgrade to Debugify Pro to keep your superpower features. ✨ CORE FEATURES (FREE FOREVER) 🛠 Live DOM & CSS Inspector (Read-Only) Hover over any element to instantly read its computed styles, layout metrics, fonts, and source CSS in a clean, readable format. 🎨 Advanced Color Tools Extract entire color palettes, use the pixel-perfect Magnifying Eyedropper, or grab the Native System Picker. Instantly convert formats between HEX, RGB, HSL, HSB, OKLCH, and more. 📸 Visible Area Screenshot Instantly capture the visible viewport of any website and copy it to your clipboard. 🚀 DEBUGIFY PRO FEATURES (Included in Trial) Live Inspector Editing Unlock two-way editing! Change styles, attributes, HTML, and text directly on the page using a powerful built-in CodeMirror editor and watch the page update in real-time. Export CSS or open elements directly in CodePen. 📱 Free-form Responsive Canvas Test your sites across multiple viewports simultaneously. Drag, drop, and arrange dozens of devices (iPhones, iPads, Monitors) on a free-form workspace. Scroll, click, and type on one device and watch it "Ghost Sync" across all other devices instantly. 📸 Pro Screenshot Engine & Editor Take full-page scrolling screenshots, crop a specific area, or cleanly capture specific DOM elements. Drop into the robust canvas editor to draw arrows, highlight elements, or blur out sensitive information before saving. ⚡ SEO & Site Intelligence Unmask the tech behind any website. Detect frameworks (React, Shopify, Next.js), fetch Geo-Intelligence (Server IP, DNS, SSL), audit on-page SEO (Meta tags, H1-H6 hierarchy), preview Open Graph cards, and validate JSON-LD Schema.org data. ♿ Accessibility (A11y) Auditor Run industry-standard Axe-core sweeps to catch missing alt text, ARIA violations, and contrast failures. Apply live Color Vision Deficiency (CVD) filters (Protanopia, Deuteranopia, etc.) to experience the web through the eyes of your users. 📦 Assets Extractor Scrape every Image, SVG, Video, and Lottie animation from the page and download them all in a single neat ZIP file. 💻 Custom Code Injector Inject custom CSS rules or JavaScript snippets on a per-domain basis. Your code persists across reloads, making it perfect for custom theming or patching client sites on the fly. ☁️ Cloud Library & Sync Save your favorite colors, code snippets, and projects. Securely sync your entire library across all your computers using Google Drive. 📄 PDF & HTML Reports Export gorgeous, client-ready PDF and HTML audit reports of your SEO, Accessibility, and Tech Stack findings. 🔒 PRIVACY BY DESIGN Debugify respects your machine and your data. • Zero Tracking: No analytics, no telemetry, and no background tracking. • Local Execution: Your captures and code edits stay entirely on your computer. • Safe Licensing: We do not track your browsing habits. Our licensing server (Polar) only checks your license key once a day to verify your subscription status. ⌨️ KEYBOARD SHORTCUTS • Alt+Shift+D - Open / Close Debugify • Alt+Shift+I - Toggle the Hover Inspector • Alt+Shift+S - Capture Visible Area • Alt+Shift+C - Launch the Color Picker