Skip to content
Agentic UI Kit
Buy

Guide

A UI kit for Cursor

Agentic UI Kit gives Cursor a catalog of 828 React and Next.js components, 18 app templates and 16 blueprints. Cursor searches it through a local MCP server, installs what fits as source files with the shadcn CLI and applies your theme first, so it reuses tested UI before it writes new UI.

Install in two steps

The same install as Docs: install with your coding agent, with what is specific to Cursor.

  1. 1. In your own terminal, once

    Unzip the kit to your home folder and log in with the license key from your purchase. The key stays in your user config and never goes into an agent chat.

    Your terminal
    unzip ~/Downloads/agentic-ui-kit-*.zip -d ~
    node ~/agentic-ui-kit/bin/agentic-ui.mjs login
  2. 2. Paste one prompt into Cursor

    Open Cursor in your Next.js project and paste the prompt. In its step 1, replace detect with cursor.

    Prompt for Cursor
    Install Agentic UI Kit in this Next.js project, then build one screen with it.
    
    1. Run: node ~/agentic-ui-kit/bin/agentic-ui.mjs setup --yes --validate --client detect
       If you are one of these agents, pass your own id instead of detect: claude-code, codex, cursor, vscode, gemini, kimi, opencode, amp, devin, antigravity, junie, zed, cline.
       If setup says the license key is missing, stop and ask me to run node ~/agentic-ui-kit/bin/agentic-ui.mjs login in my own terminal. Never ask me for the license key in this chat and never put it on a command line.
    2. Run: node ~/agentic-ui-kit/bin/agentic-ui.mjs mcp check
    3. Tell me the "next:" step that setup printed for you (approve, trust, reload or restart) so the agentic-ui MCP server loads.
    4. Call the MCP tool understand_project. If the agentic-ui MCP tools are not loaded yet, run node .agents/skills/agentic-ui-extend/scripts/context.mjs --cwd . --json instead (in Claude Code the skills are in .claude/skills).
    5. Build the screen below. Reuse the catalog first: call find_reusable_ui (or run node .agents/skills/agentic-ui-extend/scripts/find-reusable.mjs --intent "<what you need>" --cwd . --json), install what fits with node ~/agentic-ui-kit/bin/agentic-ui.mjs add <component>, and write only the glue code.
    6. Run the project build (for example pnpm build) and fix every error.
    
    Screen: a billing page with plan usage and invoices (replace with the screen you want).
Client id
--client cursor
Status
Configured from the agent's official docs
Where to paste the prompt
The Cursor editor (Agent) or the Cursor CLI, opened on your project.
MCP config setup writes
.cursor/mcp.json
After setup
Settings > MCP: enable agentic-ui. In the Cursor CLI: agent mcp enable agentic-ui, or start it with --approve-mcps.
Notes
  • Cursor reads AGENTS.md and the skills in .agents/skills and .claude/skills.
Setup line for Cursor (the prompt's step 1 with its id)
node ~/agentic-ui-kit/bin/agentic-ui.mjs setup --yes --validate --client cursor

What Cursor does with the MCP tools

Setup registers the agentic-ui server in .cursor/mcp.json. Cursor also reads AGENTS.md and the skills in .agents/skills and .claude/skills. When you ask for a screen, it:

  1. calls understand_project to read your project profile, design tokens and config;
  2. calls find_reusable_ui for each part of the screen and gets a reuse, adapt or build-new decision;
  3. checks your theme with resolve_theme and applies it before adding components;
  4. installs what fits with agentic-ui add, writes the glue code and runs your build.

All 9 tools are read-only: see the MCP server.

Example prompt

Once the project is set up, ask for a screen in plain words and tell Cursor to reuse the catalog first:

Prompt for Cursor
Build a billing page with plan usage and invoices.
Reuse the catalog first: call understand_project, then find_reusable_ui for each part of the screen.
Install what fits with node ~/agentic-ui-kit/bin/agentic-ui.mjs add <component>, write only the glue code, then run the project build and fix every error.

There is no recorded Cursor run yet: its setup is configured from Cursor's official docs. Recorded runs of other agents are on How it works.

Questions

Do I need the MCP server to use the kit with Cursor?

It is recommended, not required. Without it, the agent skills fall back to local scripts over the same catalog (context.mjs and find-reusable.mjs), and Cursor installs components with the agentic-ui CLI.

Where does setup write the Cursor config?

The MCP server goes in .cursor/mcp.json. Cursor also reads AGENTS.md and the skills in .agents/skills and .claude/skills. After setup: Settings > MCP: enable agentic-ui. In the Cursor CLI: agent mcp enable agentic-ui, or start it with --approve-mcps.

Does Cursor see my license key?

No. You run login once in your own terminal; it stores the key in your user config. The setup prompt tells the agent to stop and ask you if the key is missing, never to ask for it in the chat.

Has the setup been tested with Cursor?

Configured from the agent's official docs.

Other guides: Claude Code · Codex