Color Stack

Extract webpage theme colors instantly. Filter, sort, and copy them as Figma Styles or Variables JSON.

🎨 Color Stack — Instant page color analysis, one click to Figma Turn any webpage into a usable palette. Color Stack scans every element on the page, extracts the colors it is actually painted with, and shows each one with its real usage count — then copies the whole set into Figma as Styles or Variables JSON. ⚡ ONE-CLICK PAGE SCAN • Reads 25+ CSS properties on every element: text, backgrounds, borders, shadows, gradients, and SVG fills • Deduplicates everything into a clean palette where every swatch shows its hex and how many times it appears on the page • Follows you as you browse: the panel re-scans automatically when the active tab finishes loading • Click any swatch to copy its hex 🎛 EXPLORE & REFINE • Sort by luminosity (light or dark first), hue (rainbow order), or usage frequency • Light / Dark mode flips the viewing order to match the page you are analyzing • Filter out whites, greys and blacks with adjustable thresholds to surface the accent colors that matter • Quiet, minimal interface — the page's own colors are the only loud thing on screen ⭐ LOCAL STACK • Star a page to keep its palette in your browser (up to 500 pages) • Stored fully locally: no account, no sign-in, no sync servers 🔗 FIGMA EXPORT IN TWO FORMATS • Styles — a flat color map ready for the Color Import/Export Figma plugin • Variables — colors nested by hue family and lightness scale (blue.500, gray.200…), with usage counts in each description, ready for Figma Variables import • Built-in bilingual (English / 中文) step-by-step Figma import guide 🔒 PRIVACY BY DESIGN • All analysis happens locally in your browser — nothing is uploaded, no analytics, no trackers • No account required • Minimal permissions: activeTab, storage, sidePanel, clipboardWrite 3-STEP WORKFLOW 1. Open any webpage and click the Color Stack icon 2. Sort and filter until the palette feels right 3. Hit "Copy Figma JSON" and paste into Figma Made for UI/UX designers, brand designers and front-end developers who want real colors from real pages. • New: Figma Variables export — colors nested by hue family and lightness scale, with usage counts in each entry • New: sort by usage count, alongside luminosity and hue • Improved: fresh minimal side panel aligned with the Color Stack design system • Improved: clearer filters with adjustable thresholds, collapsible out of the way • Changed: the palette Stack is now saved locally in your browser — the cloud sync service has been retired, no account needed • Lighter: smaller package, fewer permissions, less overhead on every page you visit