Color Catcher

About this plugin

# 🎨 Color Catcher - Professional Color Utility for FigmaInstantly extract color values from any layer with smart color naming. Get HEX, RGB, HSL, CSS, OKLCH, and CMYK formats + intelligent color names from 1,566 predefined colors. One-click copy, beautiful UI, lightning fast.### ✨ Key Features**🏷️ Smart Color Naming (NEW!)*** Automatically identifies color names from a database of 1,566 predefined colors* Intelligent matching using advanced color distance algorithms* Shows exact matches directly, approximate matches with "≈" prefix* Click-to-copy color names just like color values**🎯 Instant Color Extraction*** Select any layer with solid fill and get complete color information* Supports HEX, RGB, HSL, CSS, OKLCH, and CMYK color formats* Real-time updates as you select different layers* Works with shapes, text, components, and any layer with solid fills**↕️ Customizable Format Order (NEW!)*** Drag and drop to reorder the format list exactly the way you prefer* Your order persists across sessions (saved automatically)* A small reset control appears when you customize the order**📋 One-Click Copy*** Click any color format to copy instantly to clipboard* Copy color names with a single click* Visual feedback confirms successful copies* Clean, formatted output ready for development and print workflows**🌟 Beautiful User Experience*** Modern, shadcn-inspired interface design* Smooth animations and micro-interactions* Large color swatch preview with hover effects* Responsive design optimized for different Figma window sizes* Smart onboarding for first-time users**🚀 Lightning Performance*** Built with vanilla JavaScript for maximum speed* Real-time color detection as you select layers* Optimized color matching algorithms* No lag, no loading times### 🎨 How It Works1. **Select a Layer**: Click any shape, text, or component with a solid fill2. **Instant Results**: See color values appear immediately3. **Smart Naming**: Get intelligent color names like "Navy Blue" or "Coral Red"4. **Copy Any Format**: Click HEX, RGB, HSL, CSS, OKLCH, CMYK, or the color name to copy5. **Stay in Flow**: Continue designing without leaving Figma### 🌈 Modern + Print-Ready Color Formats**OKLCH** is a perceptually uniform color space that makes color relationships more consistent than HSL. Perfect for modern design systems and advanced CSS workflows.**CMYK** gives you print-ready color percentages for packaging, branding, marketing materials, and other production workflows.### 🛠️ Technical Excellence**Advanced Color Matching*** Weighted Euclidean distance algorithm in RGB+HSL color space* 1,566 named colors from the NTC (Name That Color) database* Distinguishes between exact and approximate matches* Optimized for performance and accuracy**Professional Development*** Built with TypeScript for type safety* Clean, maintainable code architecture* No external dependencies for maximum reliability* Regular updates and improvements### 🎯 Perfect For**Design Handoffs*** Export color values for developers* Provide consistent color naming across teams* Create comprehensive style guides**Print & Branding Work*** Quickly access CMYK percentages for production* Maintain consistency between digital and print assets* Speed up packaging and marketing workflows**Design System Work*** Document color palettes with proper names* Ensure color consistency across projects* Quick color reference during design work**Personal Projects*** Explore and understand color relationships* Learn color names and properties* Speed up your design workflow### 📦 What's New in v1.3+* 🖨️ **CMYK Support**: Adds print-ready `CMYK(C M Y K)` output* 🌈 **OKLCH Support**: Adds `oklch(L C H)` output* ↕️ **Drag to Reorder Formats**: Customize the format list by dragging* 💾 **Persistent Preferences**: Format order is saved across sessions* ↩️ **Reset Order**: Small reset control appears after customization* ✨ **Smart Color Naming**: 1,566 intelligent color names### 💬 Feedback & SupportBuilt with love for the design community. Send feedback directly through the plugin or report issues on GitHub. We're constantly improving based on your suggestions!---**🚀 Try Color Catcher today and transform how you work with colors in Figma!***Plugin ID: 1605725747312426245*