vibe-components

Get Vibe Components documentation

Fetch this project's own documentation — getting started, MCP usage, architecture, and design system pages. Call with no arguments to see the list of available pages and their summaries; call with a topic to fetch a specific page's full content. Use this whenever you have ANY doubt about how something should work, rather than guessing.

Search Vibe Components

Search the Vibe Components registry by keyword, category, theme, settings availability, and version availability. Returns compact metadata only (slug, name, category, tags, theme support, capability flags, npm deps) — never source code. Call get_component next for any slug you want to install.

Get a Vibe Component

Fetch full install details for one component: source code (all local supporting files), npm/internal dependencies, anatomy, states, motion/sound spec, accessibility notes, and — when applicable — `supportingFiles`: shared internal modules (lib/cn, motion tokens, sound engine, UI primitives) with their exact source and per-file integration guidance (copy-if-missing, adapt-existing-equivalent, or requires-root-provider). Reuse an existing equivalent utility in the target project instead of blindly

Compose a page from Vibe Components

Given a natural-language page brief (e.g. "dark-mode developer portfolio" or "LinkedIn-style profile feed"), returns an ordered plan of which components to use, why, and in what role (identity/cta/section) — plus the aggregated npm install command and the design system briefing needed to compose them well. Checks a small set of curated recipes first (developer portfolio, LeetCode/competitive-coding dashboard, booking flow, professional feed) and falls back to keyword heuristics otherwise. This d

Get a brand's UI/UX playbook

Fetch a concrete, checkable UI/UX playbook for a specific brand's design language (e.g. "google") — not generic principles, but specifics like exact contrast/border conventions and how selection state is colored. Call with no arguments to list available brands. Pass the returned id to audit_ui's `brand` argument to check code against it, or read it directly to brand-align a design you're building from scratch.

Audit UI/UX

Run React/Tailwind source through a UI/UX heuristic checklist and return concrete findings (severity, line, what's wrong, how to fix it) — covering low-contrast affordances, hover-only signaling, arbitrary type/spacing values, dark-mode parity, missing focus-visible states, missing accessible names on icon buttons, and undersized hit targets. Give EITHER `slug` (a Vibe Components registry component) OR `source` (raw code from the caller's own project — paste the file contents). Optionally pass `