Skip to content
DocsSupportPricing
Roadmap (has updates coming soon)XFigma3.6K
Sign inGet All-Access
Overview
  • Introduction
  • Get Started
  • License Setup
  • Styling
  • Registry
  • MCP Server
  • Embed
  • Agent Skills
  • llms.txt
  • RTL
  • Changelog
  • YouTube
MCP Server
  • Claude
  • CodexCodexCodex
  • Cursor
  • Grok
  • Conductor
  • v0
  • Lovable
  • Replit
  • Bolt
  • OpenCode
  • VS Code
  • GitHub Copilot
  • Kilo Code
  • Zed
  • Antigravity
  • WSWindsurf
  • CLCline
  • Gemini CLI
  • AMAmp
  • JBJetBrains Junie
Components
  • Alert
  • Autocomplete
  • Badge
  • CascaderCascader can now search the whole tree from any level
  • Code Block
  • Data GridData Grid now scrolls in RTL without an extra provider
  • Date Selector
  • Event Calendar
  • File Upload
  • Filters
  • Frame
  • Gantt
  • Icon Stack
  • Icon Tile
  • Kanban
  • Number Field
  • Phone Input
  • Rating
  • Scrollspy
  • Signature PadNew Signature Pad docs
  • Sortable
  • Stepper
  • Time PickerNew Time Picker docs
  • Timeline
  • Tree

GitHub Copilot

PreviousNext

Connect the ReUI MCP server to GitHub Copilot and build UI from the ReUI registry by chat.

GitHub Copilot connects to ReUI in one step, so you can build UI from the ReUI registry right inside your editor. The endpoint is the same everywhere, https://mcp.reui.io over Streamable HTTP, but Copilot configures MCP differently on each surface, so pick yours below. For the shared background (the tools, the plan limits, the sign-in flow) see the MCP server overview.

Connect ReUI

Add the ReUI MCP server

Create .vscode/mcp.json in your workspace:

.vscode/mcp.json
{
  "servers": {
    "reui": {
      "type": "http",
      "url": "https://mcp.reui.io"
    }
  }
}

You can also run MCP: Add Server from the Command Palette and pick Workspace or Global as the target. Then open Chat in Agent mode so Copilot can call the ReUI tools.

Sign in with ReUI

VS Code first asks you to confirm you trust the server. Trust it, and on the first ReUI tool call a browser tab opens with a "Sign in with ReUI" prompt. Authorize it and you are connected. If you do not have a ReUI account yet, a free one is created in that same flow, so there is no separate signup step.

For headless or CI runs where no browser is available, create a personal token at Account → MCP and add it as a header on the same entry instead:

.vscode/mcp.json
{
  "servers": {
    "reui": {
      "type": "http",
      "url": "https://mcp.reui.io",
      "headers": {
        "Authorization": "Bearer reui_pat_your_token_here"
      }
    }
  }
}

This header is an alternative to the browser sign-in, not an addition to it. It is sent on every request and takes precedence over any OAuth credential VS Code has stored, so leave it out entirely on the sign-in path - otherwise authenticating appears to succeed while every call keeps failing.

Organization policy

On a Copilot Business or Copilot Enterprise plan, the MCP servers in Copilot policy has to be enabled by an admin before any MCP server, ReUI included, will connect.

The ReUI skill

Run this one-liner in your project root:

Install the ReUI skill
curl -fsSL https://mcp.reui.io/install | node -

It writes the ReUI skill to .claude/skills/reui and .agents/skills/reui, both of which VS Code Copilot loads as project skills (alongside .github/skills), so your agent follows ReUI's build workflow (picking the right blocks, wiring components, keeping the registry conventions) instead of guessing.

If a surface does not read those folders, nothing is lost: the same workflow ships with the server, and Copilot can pull it any time by calling the get_agent_skill tool.

Build with ReUI

Describe the interface you want in plain language and GitHub Copilot pulls the right ReUI components, examples, and blocks from the registry, then wires them into your project.

Prompt
Use ReUI to scaffold an admin app - the app-shell with a collapsible sidebar and top bar, and a dashboard page with stat cards and a chart.
Prompt
Add a data-grid of orders with sorting, column filters, pagination, and row selection, wired to my /api/orders endpoint.
Prompt
Build a multi-step "create project" wizard with the ReUI stepper and form components, with validation on each step.
Prompt
Add a kanban board for support tickets with drag and drop, grouped by status, and a filters bar above it.

Unlock premium items

Free items (the 24 components and every c-* example) install with no license. To let Copilot install premium blocks and icons too, grab a Pro or Ultimate license - one license unlocks the whole premium registry and removes the daily MCP request limit. Then add your key to the project - two quick steps:

Add your license key

Copy your key from Account → Licenses into .env.local at the project root:

.env.local
REUI_LICENSE_KEY=your-license-key-here

Add the @reui registry to components.json

components.json
{
  "registries": {
    "@reui": {
      "url": "https://reui.io/r/{style}/{name}.json",
      "headers": {
        "Authorization": "Bearer ${REUI_LICENSE_KEY}"
      }
    }
  }
}

The shadcn CLI expands ${REUI_LICENSE_KEY} from .env.local, so leave it as a variable here. This is the registry config, not the MCP config, and the two use different substitution rules: in .vscode/mcp.json prefer VS Code's own ${input:...} or ${env:...} syntax (see the VS Code guide), since that file is usually committed. GitHub's own Copilot CLI examples write ${VAR} in ~/.copilot/mcp-config.json too, though the docs never state the behaviour outright. The JetBrains, Eclipse, and Xcode mcp.json has no documented variable support, so paste the real token there and keep the file out of version control.

That is it - Copilot can now install any premium item the MCP returns, and free items keep working through the same config. See License Setup for the full guide, or compare plans on the Pricing page.

Troubleshooting

In VS Code most hiccups are a stale browser sign-in, and reconnecting fixes them. On the CLI and in JetBrains, Eclipse, or Xcode you are on a personal token, which cannot be re-authenticated - it has to be replaced.

  • Tools missing, greyed out, or "not connected" - the server did not finish connecting. To fix it, run MCP: List Servers in VS Code and restart reui (on the CLI, run /mcp and check the server is enabled), then restart your editor. If you are on a Business or Enterprise plan, confirm the MCP servers in Copilot policy is enabled.
  • 401 and you sign in through VS Code - your ReUI session expired. To fix it, run MCP: List Servers and re-authenticate reui.
  • 401 and you use a personal token (CLI, JetBrains, Eclipse, Xcode, CI) - the token has expired or been revoked. Re-authenticating will not help, because the Authorization header your config sends is not a browser session. Create a new token at Account → MCP and update the header. The 401 body names which of the two it was.
  • Requests hang or the session drops mid-build - long sessions can lose the connection. To fix it, restart the reui server from MCP: List Servers (or /mcp on the CLI) and retry your last prompt.
  • Sign-in appears to work but every call still 401s - check whether you have an Authorization header on the reui server entry. A configured credential is sent on every request and overrides the OAuth credential the sign-in stores, so while it is there running MCP: List Servers and re-authenticating reui cannot take effect. The two are alternatives, not layers: use the header only on the headless path, and remove it if you want the browser sign-in.
  • "Your free ReUI MCP allowance ... is used up" in a tool result - the free plan has a daily MCP request allowance and today's is used up. It arrives as a normal tool result Copilot shows you, not an HTTP error, so there is no status code to look for, and it resets at UTC midnight. For unlimited requests use a Pro or Ultimate license key, or a personal token from a licensed account, as your MCP credential, or wait for the reset.
  • Every ReUI call fails and nothing asks you to sign in - the stored OAuth connection is dead (revoked, expired, or invalidated after a suspicious reuse), and the client is silently retrying a credential that can never work again. Account → MCP shows the connection as Disconnected when this is the case. Reconnect the same way as the 401 fix above; retrying without signing in again cannot recover it.

Tokens expire after 90 days by default (30, 60, 90 and 180 are offered, plus No expiry for pipelines that cannot rotate). Nothing warns you beforehand, so an expired token simply starts returning 401.

VS CodeKilo Code

On This Page

Connect ReUIThe ReUI skillBuild with ReUIUnlock premium itemsTroubleshooting

Application

  • App Shell
  • Auth
  • Card
  • ChartAdded 17 Chart blocks for cron jobs, deploys, firewall traffic and SLOs
  • Dashboard
  • Dialog
  • Empty State
  • Event Calendar
  • Flow
  • Form
  • Gantt
  • Kanban Board
  • List
  • Navbar
  • Onboarding
  • Profile
  • Rich Text EditorNew Rich Text Editor category with 5 Tiptap editor blocks
  • Schedule
  • Settings
  • SheetAdded 13 Sheet blocks for cron jobs, deploys, firewall rules, SLOs and data
  • Stats
  • Timeline
  • WhiteboardNew Whiteboard category with 2 Excalidraw board blocks
  • Wizard

Solutions

  • Dev OpsNew Dev Ops category with 6 platform console blocks
  • AI Ops
  • CRMAdded 2 CRM blocks: a forecast call workspace and a deal desk
  • Agents
  • Analytics
  • Billing
  • Bookings
  • Files
  • Inventory
  • Users

AI & Agents

  • AI ChatAdded a corner chat popup block
  • Agent Activity

Templates

  • E-commerce
  • SaaS
  • Dashboard
  • Landing
  • All templates

eCommerce

  • Category Card
  • Checkout
  • Comparison
  • Coupon
  • Filter Sidebar
  • Product Card
  • Product Detail
  • Product Grid
  • Receipt
  • Review
  • Shopping Cart
  • Wishlist
  • Shop Hero

Data Grid

  • Base
  • Columns
  • Drag & Drop
  • EditingAdded a spreadsheet reorder plan Data Grid block
  • Expansion
  • Filtering
  • Grouping
  • Virtualization

Marketing

  • Blog
  • Compare
  • Contact
  • CTA
  • FAQ
  • Hero
  • How It Works
  • PricingAdded 7 Pricing blocks: plan cards, comparison tables and upgrade dialogs

Resources

  • Components
  • Blocks
  • Icons
  • MCP for Agents
  • Docs
  • Support
  • Pricing
  • Tailwind Plus Alternative
  • Roadmap(has updates coming soon)
  • AffiliateSoon

Legal

  • Privacy Policy
  • Terms & Conditions
  • License
  • Refunds
  • Cookies

© 2026 ReUI. All rights reserved.

3.6K