Kokonut UIPro

Kokonut UI ProFor teams building AI products

Agent-first
UI Components

Agent runs, tool approvals, evals and composers, plus the pages around them. Ask Claude Code, Cursor or Codex, and it lands in your repo as source you own.

Get Kokonut UI ProBrowse components

$119 once. Every update. Bought by 1k+.

99 components added since October
00Dither Voice Orb
Loading…

Ask your agent

Your agent finds the component in the Pro registry, installs it with its dependencies, and puts it on the page. The voice orb beside this is what you get.

Connect your editor onceshadcn MCP

Your editor
157Pro components19AI components6Website templates$119Once, $159 before PRO25

01For AI products

The screens an agent product needs and a component library rarely has: run traces, an agent inbox, steering, evals and the prompt box. All live.
01Run Trace
02Agent Inbox
03Steer Composer
04Eval Grid
05Double Composer
See all 19 AI components

02App components

The rest of the app, live too. A few of the 157 Pro components; each installs as source in your repo, with its dependencies.
06Kanban Board
07Onboarding Checklist
08Action Search Bar
09Action Toolbar
10Live Cursors Feature
11Password Input
See all 157 components

03Whole pages and sections

Heroes, feature sections and complete app pages, drawn here at laptop width. Ask for one by name, or describe the page.
12Clinic Dashboard
13Kinetic Type Hero
14Security Bento

04Website templates

Complete Next.js sites with every page designed, from the landing to the 404. Every one is included in Pro, or sold on its own.
Side by sideCompare all templatesEvery template's pages, stack and price, with a walkthrough of each.

05All components

Every Pro component by what you're building. Each category opens its docs page: one component live to try, a preview of the rest, and the install command for each.

Elements

Page sections

06Set up your agent once

Pro is a shadcn/ui registry behind your API key. Connect your editor and add the key, and every component is one request away.

  1. AConnect your editor

    One command adds the shadcn MCP server, so your agent can search and read every Pro component.

    Your editor

  2. BAdd your key

    Put the Pro registry in components.json, and your key from the account page in .env.local as KOKO_PRO_TOKEN.

  3. CAsk for a page

    Describe the page or name a component. Prefer the terminal? The shadcn CLI installs the same files.

Full steps for each editor are in the docs.

Built on Kokonut UI, free and open source

07Pricing

One payment for every component, section and template, and for everything added later. For you, or for a team of ten. No subscription.
Solo and Team compared
Solo1 seat$119Was $159PRO25 · 25% offTeam10 seats$374Was $499TEAM25 · 25% off
Get Kokonut UI Pro

Bought by 1k+ founders, designers and developers. Already have it? Sign in

Get Team

You add each person by email from your account. More than 10? Write to us

Per person
$119$3868% less
People
1Up to 10
Own sign-in and API key
1One each
Add and swap people
From your account
Both plans get
  • 150+ React, Tailwind and Motion components you own
  • 6 website templates, $344 bought one by one, and every one we add later
  • Works with the AI tools you already use, over MCP or a prompt
  • One-prompt setup, and docs that Claude or ChatGPT can read
  • Use it in personal, client and commercial projects
  • Pay once, with lifetime updates and no subscription
  • Email support from a person, answered within a day

Only need one template? Each is also sold alone, from $49. See templates

08Questions

Anything else, write to [email protected].

Every Pro component, section and page, installed into your project as source code you own. Every website template, downloadable from your account. Install with the shadcn CLI, or ask Claude Code, Cursor or Codex to do it for you. Every future release, with no subscription, and email support answered within a day.

Yes. A Team license covers ten people for one payment. You add each person's email from your account; they sign in with it and get their own API key, every component and every template. When someone leaves, you remove them and give the seat to someone else. Buy Team again for ten more seats, or write to us for a larger team.

Kokonut UI Pro is a private shadcn/ui registry. Once your agent is connected to the shadcn MCP server and has your API key, you ask in plain language, like “add a hero section from @kokonutui-pro to the home page”. The agent finds the right component, installs it with its dependencies and edits it in your codebase like any other file.
It works with Claude Code, Cursor, VS Code and Codex, and with any other client that speaks the Model Context Protocol.

Give your agent one line: Set up Kokonut UI Pro in this project by following https://kokonutui.pro/setup.md. It adds the registry to components.json, saves your key to .env.local, connects the MCP server and adds a short rules file, then tells you what it changed.
When you're signed in, the docs copy that prompt with your key already in it. If you'd rather do it by hand, the Agents guide walks through each step.

The key lives in .env.local as KOKO_PRO_TOKEN, and components.json only names the variable, so it never lands in your repository. The rules file tells your agent never to print, log or commit it. If it does leak, regenerate it from your account and the old one stops working.

Yes. Add .md to any docs URL to get the page as Markdown. /llms.txt lists every page with a one-line description, and /llms-full.txt has the whole docs in one file.
Every component page has an Agent tab next to the package managers, which copies a prompt instead of a CLI command. Copy Markdown and Open hand the page to ChatGPT, Claude or Cursor.

No. Every component installs with the shadcn CLI, for example npx shadcn@latest add @kokonutui-pro/split-signup-login. It's plain React, Tailwind CSS and Motion in your own codebase, so you can edit it by hand or with any tool you like.

Yes, in unlimited personal and commercial projects, including work for clients. What you can't do is redistribute or resell the components, build a component library from them, or share your API key.

You can judge the work before you pay. Each category in the docs keeps one component live to try, and the free components at kokonutui.com are built the same way.
Because it's a one-time purchase with lifetime access, we don't refund once it's complete, as our terms say. If something isn't working, write to [email protected] and we'll help.

Yes. Write to [email protected] and tell us what you need.

$119 once, with every update.

Bought by 1k+ founders, designers and developers.

Get Kokonut UI Pro