Extract the design system from any website
Paste an address and get its colours, fonts, corner radius and shadows, grouped by how the site uses them. Copy them as CSS variables or JSON.
We read the page’s public HTML and stylesheets, follow the site’s robots.txt and don’t keep the results.
What the extractor reads, and what it can’t
It loads the page you enter and the stylesheets it links to, then counts every colour, font family, corner radius and shadow the CSS declares. Colours with little saturation are grouped as backgrounds and text; the rest are brand and accent colours, ordered by how often the styles use them.
It reads one page, not the whole site, and it doesn’t run the page’s JavaScript. Styles that a script adds after loading, and colours inside images, won’t show up. The percentages count style rules, not how much of the screen a colour covers.
About the extractor
Is it free?
Yes, and there’s no sign-up. To keep it available for everyone, each visitor can run 10 extractions an hour.
Do you store the sites I check?
No. The result is shown to you and not saved.
Can I use the colours and fonts from another site?
Use the result to study a site or to document your own brand. Colours themselves are rarely protected, but logos, custom fonts and distinctive brand identities can be, so don’t copy another company’s look wholesale.
Why is a font marked as custom?
The site serves its own font file instead of loading it from Google Fonts. We show the name in a fallback font so you can look it up.
Why are some colours or fonts missing?
The extractor reads the CSS the page ships with. Sites that add their styles with JavaScript after loading, or use colours only inside images, show fewer results.