MCP Packs
UI/UX Designer Pack
Figma, component libraries, site builders, and search connected via MCP to speed up design ops.
UI/UX Designer Pack
Designers can pull assets, generate variants, and hand off changes without leaving their assistant. Connect design tools and component libraries for seamless workflows.
Recommended Servers
| Server | Purpose |
|---|---|
| Figma MCP | Browse files/frames, export assets |
| Webflow MCP | Query/update CMS items and publish changes |
| Starwind UI MCP | Search Tailwind UI patterns and snippets |
| FlyonUI MCP | Fetch components and examples for rapid prototyping |
| Algolia MCP | Search product docs or a design system index |
Example Configuration
{
"mcpServers": {
"figma": {
"command": "npx",
"args": ["-y", "@figma/mcp-server"],
"env": { "FIGMA_ACCESS_TOKEN": "${FIGMA_ACCESS_TOKEN}" }
},
"webflow": {
"command": "npx",
"args": ["-y", "@webflow/mcp-server"],
"env": { "WEBFLOW_API_TOKEN": "${WEBFLOW_API_TOKEN}" }
},
"starwind": {
"command": "npx",
"args": ["-y", "@starwindui/mcp-server"]
},
"flyonui": {
"command": "npx",
"args": ["-y", "@flyonui/mcp-server"]
},
"algolia": {
"command": "npx",
"args": ["-y", "@algolia/mcp-server"],
"env": { "ALGOLIA_API_KEY": "${ALGOLIA_API_KEY}" }
}
}
}Common Workflows
- Export a frame from Figma, ship it to Webflow CMS, and attach a component reference
- Search component libraries for patterns matching your design requirements
- Update CMS content and publish changes directly from your assistant
Safety First
Scope tokens read-only by default and restrict domains for any egress from design tools. Use separate tokens for production vs. staging environments.