VoilaDesign

About

VoilaDesign is a precision design inspector for designers and developers. Click any element on any page and instantly see its colour, typography, and spacing — no DevTools, no guessing.

🎨 COLOUR — Always Free
• Click any element to capture its colour
• HEX, RGB and HSL values with one-click copy
• 10-step shade scale (50→900) generated instantly
• Colour history and complementary palette

🔤 TYPE — Full Suite
• Font family, weight, size, line-height and letter-spacing
• 8-step type scale visualised as bars
• Secondary font pairing suggestion

📐 SPACE — Full Suite
• Full CSS box model: margin, border, padding, content
• Width, height, border-radius and gap values
• Inspect multiple elements and compare

📦 EXPORT — Full Suite
• Export design tokens to CSS Variables, Tailwind config, JSON or Figma
• Copy-paste ready :root {} block
• One click — zero friction

💷 PRICING
• Colour: Free forever — no account needed
• Full Suite (Type + Space + Export): £2.99/month or £22/year
• Cancel anytime. No credit card required for the free tier.

Built for designers who inspect, developers who build, and anyone who's ever wondered "what font is that?"