ColorCheck

Perceptual OKLCH Eyedropper, 60-30-10 Palette Extractor, WCAG Contrast & Harmony Studio for Web Designers

ColorCheck – Perceptual Color Studio & Advanced Color Extraction. _________________________________________________________________________________________________ NEW IN v2.3.0: THE PERCEPTUAL COLOR SCIENCE UPDATE 🎨 ColorCheck has been re-engineered from the ground up with a modern OKLab & OKLCH color science engine, WCAG accessibility tools, and CVD simulation! What’s New & Upgraded: • OKLab / OKLCH Engine: Clustered in human-perceptual color space for truer, cleaner extraction without edge or anti-aliasing artifacts. • DOM & CSS Inspector in Eyedropper: Hover to see real-time computed CSS properties (background-color, text color, gradients, borders) and element selectors directly in the HUD. • WCAG 2.1 Contrast Auto-Fixer: Instant contrast ratios against your base surface with 1-click auto-tuning (Fix AA / AAA) while preserving your exact OKLCH hue and chroma. • CVD Vision Simulator: Live preview and safety checks for color blindness (Protanopia, Deuteranopia, Tritanopia, and Monochromacy). • Tailwind & CSS Export: 1-click export of your palette as :root CSS custom properties or a complete 50–950 Tailwind color scale. • OKLCH Harmony Studio: Enhanced generator featuring Split-Complementary, Triadic, Analogous, and Tonal palette modes with gamut mapping. _________________________________________________________________________________________________ CORE FEATURES: 🎯 Precision Eyedropper Pick any color from any webpage with pixel-perfect accuracy. Real-time 11×11 magnification, OKLCH lightness readout, live WCAG contrast checks, and instant clipboard copy. 🎨 Smart Palette Extraction (60-30-10 & Vivid Accents) Drag to select any area of a page to extract a balanced 4-color palette: • UI Palette (60-30-10): Maps directly to design system roles (Base canvas, Primary brand, Accent 1, Accent 2) with a proportional balance preview. • Vivid Accents: Hunts for high-chroma, visually salient focal colors using perceptual saliency and maximin diversity. 🌈 Harmony Studio (Split, Triad, Analog & Tonal) Generate harmonious color schemes with true perceptual hue spacing and binary gamut mapping. Auto-fill from picked colors, explore tonal scales, or fine-tune with the native color picker. ♿ Built for Accessibility (A11y) Automatic WCAG contrast badges against the base background, 1-click contrast tuning, and instant Color Vision Deficiency (CVD) conflict warnings. ⚙️ Seamless Workflow Integration • Formats: HEX, RGB, HSL, and modern CSS Color 4 OKLCH. • Storage: Save up to 50 favorites and quickly access recent picks. • Export: Export palettes to CSS variables (:root), Tailwind configs, or JSON. • Keyboard shortcuts (Ctrl+Shift+E / Ctrl+Shift+P) & full Dark/Light theme support. _________________________________________________________________________________________________ 100% Offline & Private — No tracking, no data collection, no network requests. Everything runs locally inside your browser. _________________________________________________________________________________________________ A precision studio tool for web designers, UI/UX professionals, and frontend engineers. Apache 2.0 licensed. Provided by Mellow Solutions.