{
  "markdown": "<div align=\"center\">\n\n# Plex UI\n\n**The React component library your AI agent actually understands.**\n\n[![npm](https://img.shields.io/npm/v/@plexui/ui?color=black&label=%40plexui%2Fui)](https://www.npmjs.com/package/@plexui/ui)\n[![npm downloads](https://img.shields.io/npm/dm/@plexui/ui?color=black)](https://www.npmjs.com/package/@plexui/ui)\n[![GitHub stars](https://img.shields.io/github/stars/plex-ui/docs?style=flat&color=black)](https://github.com/plex-ui/docs/stargazers)\n[![MIT License](https://img.shields.io/badge/license-MIT-black.svg)](./packages/ui/LICENSE)\n[![Claude Code plugin](https://img.shields.io/badge/Claude%20Code-plugin-black)](https://plexui.com/docs/overview/skills)\n[![MCP server](https://img.shields.io/badge/MCP-server-black)](https://plexui.com/docs/overview/mcp)\n\n[Docs](https://plexui.com) &nbsp;·&nbsp; [Components](https://plexui.com/components) &nbsp;·&nbsp; [AI Skill](https://plexui.com/docs/overview/skills) &nbsp;·&nbsp; [Figma Kit](https://plexui.com/#pricing) &nbsp;·&nbsp; [Threads](https://www.threads.com/@plex_uikit)\n\n</div>\n\n---\n\nPlex UI is a production-grade React component library (Radix + CSS modules) with **first-class AI coding agent support**. Ship the same component library to your humans *and* your LLMs — via Claude Code, Cursor, Codex, MCP, or any agent that speaks the open Agent Skills format.\n\n## Why Plex UI\n\n- 🧑‍💻 **~50 accessible components** on Radix primitives, zero Tailwind dependency\n- 🤖 **Installable AI skill** — Claude Code plugin + Codex skill + MCP server, all official\n- 🎨 **Three-layer design tokens** — primitive → semantic → component, full dark mode\n- 🧩 **shadcn-compatible registry** — mix with existing shadcn projects in one command\n- 🧵 **Figma kit with 22,000+ variants** — 1:1 parity with the React components\n- 📦 **~40K-token skill** fits the context window without blowing up your prompts\n\n## Quick start\n\n```bash\nnpm install @plexui/ui\n```\n\n```css\n/* app/globals.css */\n@import \"@plexui/ui/css\";\n```\n\n```tsx\nimport { Button } from \"@plexui/ui/components/Button\";\n\nexport function Example() {\n  return <Button color=\"primary\">Ship it</Button>;\n}\n```\n\n### With shadcn CLI\n\nIf your project uses shadcn/ui, pull Plex UI components with one command each:\n\n```bash\nnpx shadcn@latest add https://plexui.com/r/styles.json\nnpx shadcn@latest add https://plexui.com/r/button.json\n# then: import { Button } from \"@/components/ui/button\"\n```\n\nSee [shadcn Registry docs](https://plexui.com/docs/overview/shadcn-registry) for the full list.\n\n### With AI coding agents\n\n```bash\n# Claude Code\n/plugin marketplace add plex-ui/docs\n/plugin install plex-ui@plex-ui\n\n# Codex\nnpx degit plex-ui/docs/skills/plexui/skills/plex-ui .agents/skills/plex-ui\n```\n\nSee [Skills](https://plexui.com/docs/overview/skills) for Cursor, Windsurf, Copilot, and any other Agent-Skills-compatible editor.\n\n## What you get\n\n| | Humans | Agents |\n|---|---|---|\n| **Components** | React + TypeScript | Typed skill with prop signatures |\n| **Styling** | CSS modules + tokens | Tokens documented for generation |\n| **Docs** | [plexui.com](https://plexui.com) | Indexed by skill / MCP |\n| **Examples** | MDX with live preview | Copy-paste-ready in skill |\n| **Figma** | 22,000+ variants | — |\n\n## Components (excerpt)\n\nAlert · Avatar · Badge · Button · Checkbox · CodeBlock · DataTable · DateInput · DatePicker · Dialog · EmptyMessage · Field · FileUpload · FloatingLabelInput · Input · Markdown · Menu · OTPInput · Popover · RadioGroup · SegmentedControl · Select · Sidebar · Skeleton · Switch · Tabs · TagInput · Textarea · Tooltip · …\n\nSee the [full list →](https://plexui.com/components)\n\n## Figma Design System PRO\n\n22,000+ meticulously crafted variants built entirely on Figma Variables.\n\n**[Get the Figma Kit →](https://plexui.com/#pricing)**\n\n| Personal | Team | Unlimited |\n|:--:|:--:|:--:|\n| **$49** | **$149** | **$299** |\n| 1 designer, 1 project | Up to 5 designers | Unlimited |\n| Lifetime updates | Lifetime updates | Lifetime updates |\n\n## Star ⭐ if you find this useful\n\nStars help other developers find Plex UI in GitHub search and signal that the project is worth following. If you've shipped anything with it — or just want to see where it goes — a star takes one click and means a lot.\n\n## Community & support\n\n- 🐛 [Report an issue](https://github.com/plex-ui/docs/issues/new/choose)\n- 💡 [Request a component](https://github.com/plex-ui/docs/issues/new?labels=component-request)\n- 📬 [Discussions](https://github.com/plex-ui/docs/discussions) — questions, ideas, show & tell\n- 🧵 [@plex_uikit on Threads](https://www.threads.com/@plex_uikit)\n- 📧 [plexuikit@gmail.com](mailto:plexuikit@gmail.com)\n- 🔐 [Security policy](./SECURITY.md)\n- 🤝 [Contributing guide](./CONTRIBUTING.md)\n\n## Local development\n\n```bash\nnpm install\nnpm run dev\n```\n\nOpen [http://localhost:3000](http://localhost:3000).\n\n## License\n\nReact library: [MIT](./packages/ui/LICENSE)  ·  Figma Kit: commercial via [plexui.com](https://plexui.com/#pricing)\n",
  "bytes": 4991,
  "sha": "f811021e8d92638316026fde03d9c92a45fe1c4613a08124d0e01a2db7059afb",
  "repo_slug": "plex-ui/docs",
  "fonte": "repo",
  "truncated": false,
  "api": "https://agentalog.com/api/listings/plg_plex_ui_docs_plex_ui_c6f7b105/readme"
}