ChromaKit - Discover Every Color Behind Any Website

All in one tool to Pick, convert, and export colors or assets from any webpage.

ChromaKit — Pick, convert, and export colors from any webpage Stop switching between dev tools and color apps — everything lives in one click 🎨 Pick any pixel, generate palettes, and ship CSS variables before your coffee cools ⚡ Say goodbye to hex-guessing and hello to WCAG-compliant colors in seconds 👋 🚀 Why ChromaKit? ChromaKit eliminates the tab-switching and manual conversion that slows down every design and frontend workflow. Pick any color from any webpage element — images, canvases, gradients, text — and instantly get HEX, RGB, HSL, CMYK, and Tailwind class output ready to paste. One tool replaces five. 🌟 Features 🎯 Universal Page Picker — Sample pixels from images, canvases, SVGs, and CSS backgrounds using the native EyeDropper API with a magnifier lens fallback. 🔄 Seven Format Outputs — Get HEX, RGB, RGBA, HSL, HSLA, HSV, and CMYK values with one-click copy for each. 🌈 Palette Generator — Generate complementary, analogous, triadic, split-complementary, and monochromatic palettes from any base color. ⚖️ WCAG Contrast Checker — Verify AA and AAA compliance in real time, with auto-suggested accessible alternatives when contrast fails. 🕐 Color History — Browse, search, pin, and export your last 100 picked colors as JSON or CSV. 🌅 Gradient Builder — Compose linear and radial gradients with multi-stop editing and instant CSS copy. 👁️ Color Blindness Simulator — Preview Protanopia, Deuteranopia, and Tritanopia simulations side-by-side. 🖼️ Image Color Extractor — Upload any image to sample individual pixels or auto-extract the 8 dominant colors. 📦 CSS & Tailwind Export — Output CSS custom properties and Tailwind config snippets with a custom variable name. 🔍 Perfect For Frontend developers who need accurate color values without leaving their browser UI/UX designers who validate contrast ratios and generate palettes mid-workflow Design system engineers who export CSS variables and Tailwind tokens directly from live sites Accessibility specialists who audit color contrast against WCAG AA and AAA standards Freelancers who reverse-engineer client brand colors from live websites