Veelo — Design Inspector for Developers & Designers

Veelo is a lightweight design inspector that lives in your browser. Hover over any element on any webpage to instantly extract typography, colors, contrast ratios, gradients, shadows, and production-ready CSS — no DevTools required. 🔤 FONT INSPECTOR Instantly see font family, size, weight, line height, and letter spacing for any text element. No more guessing what typeface a site uses. 🎨 COLOR GRABBER Extract exact hex, RGB, and HSL values for both text and background colors. One-click copy to clipboard. WCAG CONTRAST CHECKER Automatically calculates the contrast ratio between text and background. Shows AA and AAA pass/fail badges so you can ensure accessibility compliance. 🌈 GRADIENT DETECTOR Identifies CSS gradients on any element and displays the full gradient value. Copy the complete gradient declaration with one click. 📋 CSS SNIPPET EXPORTER Generates a clean, copy-ready CSS snippet combining all detected properties — typography, colors, backgrounds, shadows, and border-radius. 🖼️ IMAGE INFO OVERLAY Hover over images to see rendered size vs. natural resolution, file type, and source URL. Perfect for auditing image optimization. WHY VEELO? ✦ Zero setup — install and start inspecting ✦ Non-intrusive side panel — doesn't break page layout ✦ Pin any element for detailed analysis ✦ One-click copy for every value ✦ Keyboard shortcut (Ctrl+Shift+V / Cmd+Shift+V) to toggle ✦ Works on any website ✦ No data collection — 100% client-side PERFECT FOR: • Frontend developers extracting design specs • UI/UX designers auditing live websites • Accessibility engineers checking WCAG compliance • QA testers verifying design implementation • Students learning CSS and web design Veelo respects your privacy. It runs entirely in your browser, collects zero data, and requires only the minimum permissions needed to inspect page styles.