extract-design

Extract the full design language from any website URL. Produces 8 output files including AI-optimized markdown, visual HTML preview, Tailwind config, React theme, shadcn/ui theme, Figma variables, W3C design tokens, and CSS variables. Also runs WCAG accessibility scoring. Use when user says 'extract design', 'get design system', 'design language', 'design tokens', 'what colors/fonts does this site use', 'turn this URL into design tokens', 'make a Tailwind theme from this site', or '/extract-desi

Install

KitScout test notes

Not tested by KitScout yet. When our harness runs it, pros, cons and the tasks we tried appear here, with the date and evidence.

Similar tools

• algorithmic-art 193,970 ★
  Creating algorithmic art using p5.js with seeded randomness and interactive parameter exploration. Use this wh
• brand-guidelines 193,970 ★
  Applies Anthropic's official brand colors and typography to any sort of artifact that may benefit from having
• canvas-design 193,970 ★
  Create beautiful visual art in .png and .pdf documents using design philosophy. You should use this skill when
• theme-factory 193,970 ★
  Toolkit for styling artifacts with a theme. These artifacts can be slides, docs, reportings, HTML landing page
• design-is 116,728 ★
  Audit a design against Dieter Rams' ten "Good design is..." principles, then hand off a /make-plan prompt for