get-brand-components

To extract a brand design system from a website, this skill crawls key domain pages to derive real CSS tokens, typography, spacing, and assets, producing a self-contained HTML component library and tokens.css file.

Building a reusable component kit from an existing website involves scraping HTML and screenshots to extract design tokens, which then generates a minimal library of buttons, cards, headers, and footers as a self-contained HTML reference.

Yes, creating a pixel-perfect component library requires access to real CSS and assets. The skill uses scrape tools to crawl target domains and extract actual styling resources to accurately preserve the target company's branding.

Yes, you can generate on-brand HTML for a specific company. The skill outputs a manifest.json, brand-kit.md, and tokens.css that enable other downstream skills to produce collateral matching the extracted visual design system.

When you scrape a website to capture its brand design, the generated component library includes foundational UI elements like buttons, cards, headers, stats, tables, badges, hero sections, and footers as a self-contained HTML reference.

Converting a website's visual design into design tokens yields four primary outputs: tokens.css for variables, components.html for UI elements, manifest.json for metadata, and brand-kit.md for documentation to support downstream collateral generation.