MCP Design System Extractor
Server Configuration
Describes the environment variables required to run the server.
| Name | Required | Description | Default |
|---|---|---|---|
| STORYBOOK_URL | No | The URL of the Storybook instance to connect to | http://localhost:6006 |
Instructions
Guidance the server publishes about itself, which clients place ahead of the tool catalog so the model reads it before choosing anything.
This server publishes no instructions, or was last inspected before Glama recorded them.
Capabilities
Features and capabilities supported by this server
Protocol revision2025-11-25
| Capability | Details |
|---|---|
| tools | {} |
| resources | {} |
Tools
Functions exposed to the LLM to take actions
| Name | Description |
|---|---|
| list_componentsA | List all UI components available in your design system/Storybook. Returns components like modals, dialogs, buttons, forms, cards, etc. with their names, categories, and variant count. Use this to explore what components are available for building UI features. Use category="all" or omit category parameter to list all components. Supports pagination to handle large component libraries. |
| get_component_htmlA | Extract HTML from a component. Default is async (returns job_id, poll with job_status). Set async=false for sync mode. Use variantsOnly=true to get variant list. |
| search_componentsA | Search design system components by name, title, category, or purpose. Find UI components like modals, dialogs, buttons, forms, cards, etc. Supports text search (query) and semantic search by purpose. Available purposes: "form inputs", "navigation", "feedback", "data display", "layout", "buttons", "progress", "media". Supports pagination for large result sets. |
| get_component_dependenciesB | Analyze rendered HTML to find which other components a given component internally uses by detecting React components, web components, and CSS class patterns |
| get_theme_infoB | Get design system theme information (colors, spacing, typography, breakpoints) |
| get_external_cssA | Extract design tokens from CSS files. DEFAULT BEHAVIOR: Returns ONLY tokens and file statistics (small response ~1-3K tokens). Does NOT return CSS content by default to avoid token limits. For full CSS content, explicitly set includeFullCSS=true and maxContentSize. Perfect for analyzing design system tokens without hitting response size limits. |
| job_statusA | Check the status of an async job. Returns status, progress, and result when completed. Poll this endpoint to get results from get_component_html. |
| job_cancelB | Cancel a queued or running job. Returns whether the cancellation was successful. |
| job_listB | List all jobs with their status. Shows what each job is processing and whether it is still running. |
Prompts
Interactive templates invoked by user choice
| Name | Description |
|---|---|
No prompts | |
Resources
Contextual data attached and managed by the client
| Name | Description |
|---|---|
No resources | |
TDQS
Scored across 9 tools
Most tools target distinct resources: listing/searching components, extracting HTML, theme info, CSS tokens, dependency analysis, and three job-management utilities. The only real overlap is list_components vs search_components, since search without a query effectively lists, but the descriptions make the intended split (browse vs. query/semantic) clear enough.
Nearly all names follow a clean snake_case verb_noun pattern (get_component_dependencies, list_components, search_components, get_external_css). The job family breaks the pattern with noun-first names (job_status, job_cancel, job_list) instead of status_of_job / list_jobs / cancel_job, a minor but noticeable inconsistency.
Nine tools is a reasonable scope for a design system extraction server. Three of them (job_status, job_cancel, job_list) exist solely to support the async mode of get_component_html, which is slightly heavy but justified by long-running extraction jobs.
The surface covers discovery, search, HTML extraction, variant listing, dependency analysis, theme tokens, and external CSS, with async job lifecycle handled. Notable gap: no way to retrieve component props/API metadata or documentation beyond variants and HTML, which limits deeper design system analysis.