DesignSnap

About

DesignSnap is the all-in-one design inspector for UI/UX designers and developers. No more digging through DevTools or using multiple extensions!

✨ KEY FEATURES

- Hover to Inspect - Simply hover over any element to see its complete design specs
- Colors - Background and text colors with automatic HEX conversion
- Typography - Font family, size, weight, and line height
- Dimensions - Width and height in pixels
- Spacing - Margin and padding values
- Border Radius - See rounded corner values
- One-Click Copy - Click any value to copy it instantly
- Keyboard Shortcut - Toggle on/off with Ctrl+Shift+E (Windows/Linux) or ⌘+Shift+E (Mac)
- Remembers State - Stays off until you need it, across all tabs

🎯 PERFECT FOR

- UI/UX Designers
- Frontend Developers
- Web Developers
- Design Students
- Anyone extracting design specs from websites

⚡ HOW TO USE

- Click extension icon → Turn ON
- Hold Ctrl (or ⌘ on Mac) + move mouse to inspect elements
- Release Ctrl to lock panel in place
- Click any value to copy it
- Hold Ctrl again to inspect more elements
- Press Ctrl+E to turn off

🎨 BEAUTIFUL DESIGN

Modern, clean interface with smooth animations. The overlay appears next to elements so you can always see what you're inspecting.

🔒 PRIVACY FOCUSED

DesignSnap runs completely locally. No data is collected, stored, or sent to any servers. No account required.

💡 LIGHTWEIGHT

Less than 50KB. No external dependencies. Fast and efficient.

---

Questions or feedback? We'd love to hear from you!