io.github.freema/mcp-design-system-extractor
NPM · MCP-DESIGN-SYSTEM-EXTRACTOR
MCP server for Storybook design systems — extract component HTML, styles and metadata.
Available components
Last scanned (11 hours ago)
Scores higher than 98% of npm servers
Category Developer Tools
How this component scores in each security and reliability category. Every signal is checked automatically from public evidence about the published package, including repeated runs of it in an isolated sandbox, and we only credit what we can confirm. How we score → Why this is hard to score →
Supply Chain Security99
- No malware found by supply-chain analysis.Pass
- No known CVEs affecting this package version or its production dependencies.Pass
- No install/post-install scripts declared.Pass
- 34 of 129 dependencies flagged as unhealthy. View diagnostics → Partial
Provenance & Transparency97
- Source repository is publicly reachable at the declared URL. View diagnostics → Pass
- Cryptographically verified build provenance (signed, bound to freema/mcp-design-system-extractor). View diagnostics → Pass
- Clear OSI-approved license (MIT).Pass
- Actively maintained (last published 100 days ago).Pass
- Disclosure check failed: no security disclosure policy was found in the source repository. See how to fix → Fail
Schema Quality & AI Usability79
- AI-judged instruction clarity (excellent).Pass
- Context-footprint check failed: tool/resource definitions use about 1128 tokens (~125/item across 9 items; 9 tools + 0 resources), over budget; trim descriptions and params. See how to fix → Fail
- Usage-examples check failed: none of the tools include examples. See how to fix → Fail
Stability & Change Management97
- Stability observed for 29 of 30 days with no destabilising changes; credit accrues until the full window elapses.Partial
Tool Coverage100
- 100% of tools have a non-trivial description (not blank, and not just the tool's name).Pass
- 100% of tool parameters carry a description.Pass
Tool Safety100
- No prompt-injection markers were found in the server instructions, tool names or descriptions we captured.Pass
- We read all 9 captured tool definition(s), and no name or description among them implies an irreversible operation.Pass
- An AI judge read all 9 captured unit(s) of tool text and found none that tries to manipulate the model reading it.Pass
Capabilities100
- Implements a supported MCP spec version (2025-11-25); the latest is 2026-07-28.Pass
Every change we have recorded for this component, newest first. Security-relevant changes are always shown. ▲ marks a change for the better, ▼ a change for the worse; unmarked changes are neutral.
- 5 Nov 26 +1
No change was recorded against any check on this day. Stability & Change Management went from 93 to 97. That category is still filling its 30-day observation window: 28 days of observed history at the previous scan, 29 at this one. The score rises as the window fills, whether or not the server changes.
- 4 Nov 26 −1
- Stability: pass → 0.93 functional
- 29 Oct 26 0
- Stability: 0.97 → pass security
- 28 Oct 26 +1
No change was recorded against any check on this day. Stability & Change Management went from 93 to 97. That category is still filling its 30-day observation window: 28 days of observed history at the previous scan, 29 at this one. The score rises as the window fills, whether or not the server changes.
- 27 Oct 26 −1
- Stability: pass → 0.93 functional
- 21 Oct 26 0
- Stability: 0.97 → pass security
- 20 Oct 26 0
- Stability: pass → 0.97 functional
- 17 Oct 26 +2
- Stability: 0.83 → pass security
Diagnostic detail from the automated scan of this channel: what the scanner observed at each step, so you can see exactly where a check passed or failed. It is informational only and never changes the trust score.
Captured 5 Nov 2026 · Analysed npm/mcp-design-system-extractor@1.2.0
Provenance Verified
A signed build attestation was found and verified, binding this exact artifact to the source repository it claims to come from.
| Result | Verified |
|---|---|
| Ecosystem | npm |
| Reason | Verified |
| Discovered via | Registry attestation endpoint |
| Source repo | freema/mcp-design-system-extractor |
| Certificate issuer | https://token.actions.githubusercontent.com |
| Certificate SAN | https://github.com/freema/mcp-design-system-extractor/.github/workflows/publish.yml@refs/tags/v1.2.0 |
| Rekor log index | 2257273493 |
| Predicate type | SLSA build provenance https://slsa.dev/provenance/v1 |
| Subject digest | sha512:a13a9e36a90d56c2b56f1920b183027b49ae14ab6b289fb2122159923aa4f1b791f2cbd9695eebd72771a723a448c8ee04af05d86bbb3e39ce3676192 |
Background: How many MCP packages publish verified provenance →
Dependencies 129 packages
| Packages resolved | 129 |
|---|---|
| Stale | 34 |
| Tree resolution | Complete |
Background: SBOMs and build attestations, explained →
The tools this component advertises to a client, with an estimated token cost for each. Expand a tool to see its parameters and schema. The per-tool counts are indicative and are not scored directly; the schema's total context footprint is one signal in Schema Quality & AI Usability. A tool's description is untrusted text the model reads on every call, which is what makes this list a security surface and not just an inventory: how tool poisoning works →
get_component_dependencies ~58
Analyze rendered HTML to find which other components a given component internally uses by detecting React components, web components, and CSS class patterns
| Name | Type | Req | Description |
|---|---|---|---|
| componentId | string | yes | The story ID of the component (e.g., "example-button--primary") |
No output schema declared.
No examples provided.
get_component_html ~216
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.
| Name | Type | Req | Description |
|---|---|---|---|
| async | boolean | – | If true (default), returns job_id immediately - use job_status to poll for results. If false, waits for result synchronously. |
| componentId | string | yes | The story ID in format "component-name--story-name" (e.g., "button--primary") or component ID (e.g., "button") when using variantsOnly. |
| includeStyles | boolean | – | Whether to include extracted CSS styles in the response. Storybook boilerplate CSS is filtered out. Default: false. |
| timeout | number | – | Custom timeout in milliseconds (5000-60000). Only used in sync mode (async=false). Default is 15000ms. |
| variantsOnly | boolean | – | If true, returns only the list of available variants/stories for the component (synchronous). Use component ID without story suffix. |
No output schema declared.
No examples provided.
get_external_css ~213
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.
| Name | Type | Req | Description |
|---|---|---|---|
| cssUrl | string | yes | URL of CSS file to analyze. IMPORTANT: Tool returns only design tokens by default (not CSS content) to avoid response size limits. |
| extractTokens | boolean | – | Extract design tokens (colors, spacing, typography, etc.). Default: true. This is the main purpose of this tool. |
| includeFullCSS | boolean | – | OPTIONAL: Set to true ONLY if you need the actual CSS content. WARNING: Large CSS files may hit token limits. Default: false (recommended). |
| maxContentSize | number | – | OPTIONAL: Max CSS content characters when includeFullCSS=true. Default: 10000. Larger files will be truncated. |
No output schema declared.
No examples provided.
get_theme_info ~44
Get design system theme information (colors, spacing, typography, breakpoints)
| Name | Type | Req | Description |
|---|---|---|---|
| includeAll | boolean | – | Whether to include all CSS custom properties found (default: false) |
No output schema declared.
No examples provided.
job_cancel ~35
Cancel a queued or running job. Returns whether the cancellation was successful.
| Name | Type | Req | Description |
|---|---|---|---|
| job_id | string | yes | The job ID to cancel |
No output schema declared.
No examples provided.
job_list ~63
List all jobs with their status. Shows what each job is processing and whether it is still running.
| Name | Type | Req | Description |
|---|---|---|---|
| status | string | – | Filter by status: "all" (default), "active" (queued/running), "completed" (completed/failed/cancelled) |
No output schema declared.
No examples provided.
job_status ~53
Check the status of an async job. Returns status, progress, and result when completed. Poll this endpoint to get results from get_component_html.
| Name | Type | Req | Description |
|---|---|---|---|
| job_id | string | yes | The job ID returned from get_component_html |
No output schema declared.
No examples provided.
list_components ~192
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.
| Name | Type | Req | Description |
|---|---|---|---|
| category | string | – | Filter components by category path (e.g., "Components/Buttons", "Layout"). Use "all" or omit to list all components. |
| compact | boolean | – | If true (default), returns compact format with only id, name, title, and variantCount. If false, returns full component data including all stories. |
| page | number | – | Page number (1-based). Default is 1. |
| pageSize | number | – | Number of components per page (1-100). Default is 20. |
No output schema declared.
No examples provided.
search_components ~254
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.
| Name | Type | Req | Description |
|---|---|---|---|
| page | number | – | Page number (1-based). Default is 1. |
| pageSize | number | – | Number of components per page (1-100). Default is 20. |
| purpose | string | – | Semantic search by purpose. Available: "form inputs", "navigation", "feedback", "data display", "layout", "buttons", "progress", "media". Can be combined with query. |
| query | string | – | Text search query (e.g., "button", "form", "nav"). Use "*" to list all. Case-insensitive partial matching. Optional if purpose is provided. |
| searchIn | string | – | Where to search: "name" (component name only), "title" (full path), "category" (grouping), or "all" (search everywhere, default) |
No output schema declared.
No examples provided.
How do I install the io.github.freema/mcp-design-system-extractor server?
io.github.freema/mcp-design-system-extractor runs locally as an npm package, launched with npx -y mcp-design-system-extractor. Ready-made configuration for Claude, Cursor, VS Code, Codex and 5 more is on this page, copied from each client's own documentation.
npm · mcp-design-system-extractor
claude mcp add freema-mcp-design-system-extractor -- npx -y mcp-design-system-extractor
What is the io.github.freema/mcp-design-system-extractor server?
io.github.freema/mcp-design-system-extractor is listed in the public MCP registry as io.github.freema/mcp-design-system-extractor. MCP server for Storybook design systems, extract component HTML, styles and metadata. This page covers its npm package (mcp-design-system-extractor).
Is the io.github.freema/mcp-design-system-extractor server safe to use?
io.github.freema/mcp-design-system-extractor scores 95 out of 100 on VerifyMCP. We found no known CVEs affecting it as of 5 November 2026. It declares no install or post-install scripts. Its build provenance is signed and verified. That is a record of what we were able to check automatically, not an endorsement. The category breakdown on this page shows every signal behind the number, including the ones we could not confirm.
What tools does the io.github.freema/mcp-design-system-extractor server expose?
io.github.freema/mcp-design-system-extractor exposes 9 tools: list_components, get_component_html, search_components, get_component_dependencies, get_theme_info, and 4 more. Their descriptions and schemas cost roughly 1,128 tokens of context every time the server is loaded.
Is the io.github.freema/mcp-design-system-extractor server still maintained?
io.github.freema/mcp-design-system-extractor is still listed as active in the MCP registry. We last reached this channel on 5 November 2026. Those dates come from our own scans of the registry and the channel itself, not from anything the publisher announced.
What licence is the io.github.freema/mcp-design-system-extractor server under?
io.github.freema/mcp-design-system-extractor declares the MIT licence, which is OSI-approved. That covers the source only, and says nothing about the cost of any service it calls.