site-design-replication

You extract design tokens by crawling the target website to pull colors, typography, spacing, borders, and shadows directly from its styles. This captures the foundational design elements needed to document a reusable pattern library.

Yes, you can clone an existing website design system and remix it for a new product with a different brand. By adapting the extracted design tokens and content, the workflow generates remix-ready documentation to align the cloned architecture with your new brand identity.

The best way to document a crawled design system for LLM workflows is generating LLM-friendly markdown files. The process specifically outputs COMPONENTS.md and STYLES.md files, structuring the extracted design tokens and patterns into remix-ready documentation.

No specific dependencies or components are required for design system replication. The skill operates independently to crawl target sites and extract design tokens without needing external libraries or framework installations.

You remix existing website designs into new concepts by adapting the extracted design tokens and content. The workflow takes the crawled site architecture, updates the tokens to match a new concept, and outputs remix-ready documentation for the new design.

You need to crawl a website for design token extraction when you want to reverse-engineer an existing site's visual architecture into a structured pattern library. This is essential for cloning sites, building design systems, or preparing remix-ready documentation for new products.