CSS Inspector

Click the extension icon or press Cmd+Shift+C to activate, then hover any element to inspect its computed CSS.

CSS Inspector makes it easy to view and copy CSS properties from any webpage. Simply hover over any element to see its styles in a clean sidebar - no need to dig through DevTools. PERFECT FOR - Frontend developers building websites - Designers implementing mockups - Students learning CSS - Anyone who frequently checks styles KEY FEATURES Instant Inspection Hover over any element to instantly see all its CSS properties organized by category - Layout, Typography, Spacing, Colors, and more. Multiple Copy Formats Copy CSS exactly how you need it: - Standard CSS: .selector { property: value; } - Inline styles: style="property: value;" - CSS-in-JS: { property: 'value' } Element Hierarchy See the full path: body > div.container > button.cta Visual Highlighting Blue border shows exactly what you're inspecting. Keyboard Shortcuts Toggle inspector with Alt+Shift+C (Cmd+Shift+C on Mac). HOW TO USE 1. Click the extension icon or press Alt+Shift+C 2. Hover over any element on the page 3. View organized CSS properties in the sidebar 4. Click "Copy All" or copy individual properties 5. Choose your format and paste anywhere PRIVACY - Zero data collection - No external servers - All processing happens locally in your browser - No analytics or tracking WHY CSS INSPECTOR? DevTools is powerful but can be overwhelming. CSS Inspector is lightweight and laser-focused on one task: quickly viewing and copying CSS. Perfect for those moments when you just need to grab a few properties without opening the full inspector. Made with ❤️ for developers and designers everywhere.