ReplayAutonomous app testing for teams who ship at AI-speed
Promoted
Launched this week
Tearsheet
Extract design palettes that actually match what you see
5 followers
Extract design palettes that actually match what you see
5 followers
A local design reference gallery for images and video. Claude Code catalogs each one, extracts its color palette, and can scaffold the mood, typography, and UI patterns straight into a new Figma file or Claude Design project. - jeanpaulbondy-la/tearsheet
Hey Product Hunt! Jean-Paul here.
I built Tearsheet because I was losing my mind.
Every design project starts the same way: I'd collect references, screenshots, mood boards. Hundreds of them. But once I had them, they were just images. I couldn't extract the colors for my design system. The palette tools would destroy all the vibrant reds and teals. The type was impossible to identify systematically.
So I'd recreate palettes by hand, squint at screenshots to guess typefaces, rebuild components from memory. Hours of manual work.
The root cause: every palette extractor uses RGB clustering. It averages colors in linear RGB space, which is not how humans perceive color. A vivid red gets averaged down to brown. A teal disappears into the background.
I switched the algorithm to CIE LAB color space (perceptually uniform) + k-means clustering + saturation weighting. Now the tool actually sees colors the way I do. 71% better at capturing reds alone.
Tearsheet is the result: drop in your references, extract colors/typography/UI patterns, export to Figma or use to bootstrap your design system. Runs locally, stays private, integrates with Claude Code.
It's free and open source because design systems should be built on real color science, not RGB approximations.
I'm here to answer questions about the color space deep dive, the k-means++ algorithm, design systems workflows, or why this matters. Ask away!