Playground Tool · Colour Palette Extractor
Extract a colour palette in seconds. Paste CSS or HTML, get usable swatches and Tailwind config.
Perfect for reverse-engineering themes, tidying brand colours, or building a design system. Works with hex, rgb(a) and hsl(a) values.
Paste styles from anywhere · No upload · Free tool
Coming soon: image-based palette extraction
Source styles
The extractor looks for #hex, rgb(), rgba(), hsl() and hsla() patterns.
Tailwind colours snippet
// Extract a palette first to generate a Tailwind config snippet.
Tailwind snippet copied.
Extracted palette
Unique colours found: 0
Colours are grouped as they appear. For more advanced naming and grouping you can copy the Tailwind snippet into your config and refine it there.