Vibe Design System MCP Server

@mondaycom

Basic information

About Vibe Design System MCP Server

🎨 Vibe Design System - Official monday.com UI resources for application development in React.js

#react #javascript #typescript #ui #js#reactjs#mcp #icons#codemod#component-library#ui-components#tsx#vibe#hacktoberfest#design-system#ui-library#monday#llm #mcp-server #vibe-coding

Vibe Design System MCP Server config

No standard config provided

This server doesn't expose a parseable MCP config block in its README. See the repository for install instructions.

Repository

Vibe Design System MCP Server tools

Tool list not available yet

This listing does not currently have a tool list to display. This does not mean the server has no tools; check its documentation for supported capabilities.

We auto-extract tools from the README. The maintainer can list them under a ## Tools heading to populate this section.

Overview

What is Vibe Design System?

Vibe Design System is a collection of official monday.com UI resources for application development in React.js. It includes an MCP (Model Context Protocol) server that provides intelligent assistance for discovering component APIs, getting usage examples, finding appropriate icons, and following best practices.

How to use Vibe Design System?

Install the core library via npm install @vibe/core or yarn add @vibe/core, then import the CSS tokens in your root file. Components like Button are imported from @vibe/core. For MCP integration, follow the installation instructions in the @vibe/mcp documentation to connect with your preferred AI development tools.

Key features of Vibe Design System

Core component library for React.js applications
MCP server for intelligent component assistance
Icons library (@vibe/icons)
Testing utilities for Playwright (@vibe/testkit)
Codemods and CLI tools (@vibe/codemod)
Styling foundations included in @vibe/core

Use cases of Vibe Design System

Building monday.com-compatible UIs with consistent design
Rapidly prototyping React applications using pre-built components
Discovering component APIs and usage examples via AI tools
Migrating between major versions with codemod tooling

Frequently asked questions

What does the Vibe Design System MCP server do?

It provides intelligent assistance for working with Vibe components, helping you discover component APIs, get usage examples, find appropriate icons, and follow best practices.

How do I install and use Vibe Design System?

Install `@vibe/core` via npm or yarn, import the tokens file, then import components directly from the library. For the MCP server, refer to the `@vibe/mcp` documentation.

What other packages are part of the ecosystem?

The ecosystem includes `@vibe/core`, `@vibe/icons`, `@vibe/testkit`, `@vibe/codemod`, `@vibe/style`, `vibe-storybook-components`, `storybook-addon-playground`, and `@vibe/mcp`.

What are the older versions and their support status?

Vibe 3 (`@vibe/core` v3) receives critical bug fixes but no new features. Vibe 2 (`monday-ui-react-core`) is no longer maintained. All users should migrate to Vibe 4.

Where can I get help or suggest improvements?

Open a discussion on GitHub for questions or suggestions, or open an issue for bugs found.

Comments

More Media & Design MCP servers

Cardboard AI

A video editor you use by chatting in Claude or ChatGPT. Bring your footage, ask for cuts, captions, titles and music, then download the finished video.

Instagram + TikTok Downloader & Transcriber

IYIA

Instagram + TikTok content tools inside your AI: download HD posts/reels/carousels, view Instagram stories anonymously, AI-transcribe videos (100+ languages, SRT/VTT/TXT). Requires a Repost PRO subscription.

CampaignStack

Run LinkedIn and email outreach from Claude, safely. Made for lead gen agencies, founders and medium-large companies. Every account gets enforced daily limits, its own proxy, and a review queue before anything sends.

Organize with AI (OwAI)

Alexander Visheratin

Search and manage photo and video libraries through AI assistants. Find images and video moments, review duplicates, and organize collections, groups, favorites and people across local folders, Apple Photos and OneDrive.

GOJI

GOJI Agency

A remote MCP server from GOJI, a full-service digital agency in Melbourne, Australia. Nine tools over published material: a 104-term plain-English glossary, a 14-chapter guide to AI visibility, seven long-form guides inc