IGDS Storybook MCP Server
Enables access to Angular-specific component documentation within the IGDS Storybook, allowing retrieval of component details, source code, stories, and examples.
Enables access to React-specific component documentation within the IGDS Storybook, allowing retrieval of component details, source code, stories, and examples.
Provides tools for querying IGDS component documentation from Storybook, including component lists, argTypes, source code, CSS, stories, and rendered HTML examples for Angular, React, and Core-Web frameworks.
Click on "Install Server".
Wait a few minutes for the server to deploy. Once ready, it will show a "Started" state.
In the chat, type
@followed by the MCP server name and your instructions, e.g., "@IGDS Storybook MCP ServerShow me the React button component documentation"
That's it! The server will respond to your query, and you can continue using it as needed.
Here is a step-by-step guide with screenshots.
IGDS Storybook MCP Server
MCP server for the Israeli Government Design System (IGDS) component documentation. Provides access to Storybook component data and Zeroheight design system documentation.
Overview
This server exposes 17 tools for querying IGDS components across:
Storybook: Angular, React, Core-Web frameworks with source code, props, and rendered examples
Zeroheight: Design guidelines, usage documentation, accessibility info, and images
Related MCP server: storybook-renderer
Installation
npm installRunning the Server
# Build TypeScript
npm run build
# Start the MCP server
npm run startThe server runs via stdio transport and connects to MCP clients.
Using with Claude Desktop
Add to your claude_desktop_config.json:
{
"mcpServers": {
"igds-storybook": {
"command": "node",
"args": ["<path-to-project>/dist/index.js"]
}
}
}Replace <path-to-project> with the actual path to this project on your machine.
Using with MCP Inspector
Option 1: Stdio (default)
npm run inspectorOpens the Inspector web UI at http://localhost:6274 and connects via stdio automatically.
Option 2: HTTP (Streamable HTTP)
First start the HTTP server, then connect the Inspector to it:
# Terminal 1: Start HTTP server
npm run http
# Terminal 2: Start Inspector and connect to HTTP server
npx @modelcontextprotocol/inspector --transport streamable-http http://localhost:3000/mcpRunning over HTTP
To expose the MCP server over HTTP instead of stdio:
# Run with HTTP transport
npm run httpThen connect to http://localhost:3000/mcp from your MCP client.
MCP Tools
Storybook Tools
Tool | Description | Parameters |
| Load Storybook data for a framework |
|
| List components for a framework |
|
| Get component docs with argTypes |
|
| Get source code structure (properties, CSS, defaults) |
|
| Get CSS styles |
|
| Get all story variants |
|
| Get rendered HTML examples |
|
| Get story entry by ID |
|
| Search across frameworks |
|
| Compare across Angular/React/Core-Web |
|
Zeroheight Tools
Tool | Description | Parameters |
| List component categories | (none) |
| List components |
|
| Get full component documentation |
|
| Get design/code/usage/accessibility section |
|
| Search Zeroheight content |
|
| Get Storybook cross-references |
|
Utility
Tool | Description | Parameters |
| Get data statistics | (none) |
Data Included
Storybook (145 components)
Angular: 48 components, 473 stories, 75 source classes
React: 48 components, 425 stories, 68 source classes
Core-Web: 49 components, 435 stories, 53 source classes
Zeroheight (50+ components)
7 categories: Buttons, Input & Selection, Indicator & Status, Content Display, Navigation, Messaging, Data & Tables
Sections: Design, Code, Usage, Accessibility for each component
1000+ images downloaded locally
Bidirectional cross-references to Storybook components
Data Files
File | Description |
| Storybook components, source code, stories |
| Zeroheight docs with cross-references |
| Downloaded component images |
License
ISC
Maintenance
Resources
Unclaimed servers have limited discoverability.
Looking for Admin?
If you are the server author, to access and configure the admin panel.
Related MCP Servers
- AlicenseAqualityCmaintenanceMCP server that exposes the @bunge/ds-components design system catalog, allowing AI assistants to list, search, and retrieve component details including inputs, outputs, usage examples, and import instructions.4MIT
- Flicense-qualityDmaintenanceMCP server to query and render the Doggie UI design system's Storybook documentation, enabling component search, URL rendering, and natural language questions.
- Flicense-qualityDmaintenanceAutomated MCP server for the Insider Design System. Enables AI assistants to discover, understand, and generate code for over 60 Design System components with automated extraction from source code.
- Alicense-qualityCmaintenanceComprehensive MCP server for end-to-end UI development, offering tools to generate components, manage design tokens, audit accessibility, autofix issues, inspect live pages, compare screenshots, and more across multiple frameworks.17MIT
Related MCP Connectors
The official MCP Server from Mia-Platform to interact with Mia-Platform Console
An MCP server that let you interact with Cycloid.io Internal Development Portal and Platform
data.gov.il MCP — Israel national open-data portal (CKAN API).
Latest Blog Posts
- Who's Calling? MCP Hosts Are an Identity Blind Spot (And the Spec Knows It)By Om-Shree-0709 on .mcpAgent IdentityOAuth 2.1
- Your AI Chatbot Just Exposed Your CEO's Salary to an InternBy Om-Shree-0709 on .Agent IdentityMCP SecurityOAuth Delegation
- Why MCP Servers Need Execution Sandboxing (And Why Your Current Stack Isn't Enough)By Om-Shree-0709 on .Agentic AiPrompt InjectionWebAssembly
MCP directory API
We provide all the information about MCP servers via our MCP API.
curl -X GET 'https://glama.ai/api/mcp/v1/servers/michab23/igds-storybook-MCP'
If you have feedback or need assistance with the MCP directory API, please join our Discord server