# QuasarUI MCP server

Find Quasar Framework(Vue) UI Components and paste their source. Free Components need no key.

## At a glance

QuasarUI is an MCP server in the Other category. It runs locally over stdio via `npx -y quasarui-mcp`, and needs QUASARUI_ACCESS_KEY and Authorization. It exposes 5 tools, including list_blocks, list_components and search_components. It scores A (80/100) on the MCP Skills Hub health score as of Oct 28, 2026.

## Install

### How to install QuasarUI in Claude Code

1. Add the server

```bash
claude mcp add quasarui -e 'QUASARUI_ACCESS_KEY=<QUASARUI_ACCESS_KEY>' -- npx -y quasarui-mcp
```

2. Fill in your credentials

   Replace <QUASARUI_ACCESS_KEY>, Bearer <YOUR_TOKEN> with your real values. Keep secrets out of any config file you commit.

3. Verify it's connected

```bash
claude mcp list
```

4. Sharing it with your team?

   Add `--scope project` to write it to .mcp.json in the repository root, which you can commit (with the secrets left as environment variables).

5. Use it in a session

   Ask Claude to use the tools this server exposes (e.g. list_blocks, list_components, search_components). It discovers them automatically.

### How to install QuasarUI in Claude Desktop

1. Open your MCP config

   macOS: ~/Library/Application Support/Claude/claude_desktop_config.json · Windows: %APPDATA%\Claude\claude_desktop_config.json

2. Add this server

```json
{
  "mcpServers": {
    "quasarui": {
      "command": "npx",
      "args": [
        "-y",
        "quasarui-mcp"
      ],
      "env": {
        "QUASARUI_ACCESS_KEY": "<QUASARUI_ACCESS_KEY>"
      }
    }
  }
}
```

3. Fill in your credentials

   Replace <QUASARUI_ACCESS_KEY>, Bearer <YOUR_TOKEN> with your real values. Keep secrets out of any config file you commit.

4. Restart Claude Desktop

   The tools appear under the 🔌 menu once the app reloads.

### How to install QuasarUI in Cursor

1. Create / edit .cursor/mcp.json in your project

```json
{
  "mcpServers": {
    "quasarui": {
      "command": "npx",
      "args": [
        "-y",
        "quasarui-mcp"
      ],
      "env": {
        "QUASARUI_ACCESS_KEY": "<QUASARUI_ACCESS_KEY>"
      }
    }
  }
}
```

2. Fill in your credentials

   Replace <QUASARUI_ACCESS_KEY>, Bearer <YOUR_TOKEN> with your real values. Keep secrets out of any config file you commit.

3. Enable it

   Cursor Settings → MCP → toggle the server on. Tools become available to the Composer/Agent.

### How to install QuasarUI in Codex CLI

1. Add to ~/.codex/config.toml

```toml
[mcp_servers.quasarui]
command = "npx"
args = ["-y", "quasarui-mcp"]
env = { QUASARUI_ACCESS_KEY = "<QUASARUI_ACCESS_KEY>" }
```

2. Fill in your credentials

   Replace <QUASARUI_ACCESS_KEY>, Bearer <YOUR_TOKEN> with your real values. Keep secrets out of any config file you commit.

3. Run Codex

   Codex loads MCP servers from config.toml on startup and exposes their tools to the agent.

### How to install QuasarUI in Windsurf

1. Edit ~/.codeium/windsurf/mcp_config.json

```json
{
  "mcpServers": {
    "quasarui": {
      "command": "npx",
      "args": [
        "-y",
        "quasarui-mcp"
      ],
      "env": {
        "QUASARUI_ACCESS_KEY": "<QUASARUI_ACCESS_KEY>"
      }
    }
  }
}
```

2. Fill in your credentials

   Replace <QUASARUI_ACCESS_KEY>, Bearer <YOUR_TOKEN> with your real values. Keep secrets out of any config file you commit.

3. Reload

   Windsurf → Cascade → refresh MCP servers. Cascade can now call the tools.

### How to install QuasarUI in Cline

1. Open Cline → MCP Servers → Configure

   Adds to cline_mcp_settings.json.

2. Add the server

```json
{
  "mcpServers": {
    "quasarui": {
      "command": "npx",
      "args": [
        "-y",
        "quasarui-mcp"
      ],
      "env": {
        "QUASARUI_ACCESS_KEY": "<QUASARUI_ACCESS_KEY>"
      }
    }
  }
}
```

3. Fill in your credentials

   Replace <QUASARUI_ACCESS_KEY>, Bearer <YOUR_TOKEN> with your real values. Keep secrets out of any config file you commit.

### How to install QuasarUI in VS Code

1. Create .vscode/mcp.json

```json
{
  "servers": {
    "quasarui": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "-y",
        "quasarui-mcp"
      ],
      "env": {
        "QUASARUI_ACCESS_KEY": "<QUASARUI_ACCESS_KEY>"
      }
    }
  }
}
```

2. Fill in your credentials

   Replace <QUASARUI_ACCESS_KEY>, Bearer <YOUR_TOKEN> with your real values. Keep secrets out of any config file you commit.

3. Start it

   VS Code shows a ▶ Start action above the server entry. Agent mode (Copilot Chat) can then use the tools.

## Tools

- `list_blocks` — Lists every Block with its Component counts
- `list_components` — Lists the Components in a Block, each marked free or paid
- `search_components` — Finds Components by what they are, such as "login form" or "sidebar"
- `get_component` — Returns a Component's source
- `get_setup_guide` — Explains how to set up a project and paste a Component

Source repository: https://github.com/quasarui/quasarui-mcp

---

Source: https://mcp-skills-hub.vercel.app/mcps/com-quasarui-mcp · MCP Skills Hub · data as of 2026-10-28T12:31:05Z
