CSS Inspector

About

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.