{"id":"ce50b4d7-d0bf-410e-b3e3-087e88d0c8be","slug":"plyxui","kind":"mcp","name":"plyxui","summary":"Cross-platform component library. Eleven npm packages, per-package install, branded tokens, first-party MCP. Web + native via .ts / .native.ts.","owner":"vineethpawar","repoUrl":"https://github.com/vineethpawar/plyxui","license":"MIT","licenseTier":"permissive","trust":"community","stars":49,"match":null,"fewStars":false,"format":"mcp","createdAt":"2026-05-25T09:28:39.000Z","addedAt":"2026-10-14T05:42:34.266Z","logoUrl":"https://avatars.githubusercontent.com/u/55575881?u=951761f5723c65841a1b97439690135cbce8c92b&v=4","linkOnly":false,"collection":null,"skillPath":null,"categories":["developer-tools","design-media"],"tags":["agent-aware","component-library","cross-platform","design-system","electron","monorepo","next-js","react"],"runtime":"binary","local":true,"cloudCapable":false,"cloudCapability":"unknown","cloudReadyOnPlatform":false,"needsApiKey":false,"reviewed":false,"syncedAt":"2026-10-17T06:30:51.069Z","sample":false,"url":"https://conduits.dev/tools/plyxui","language":"TypeScript","transports":["stdio"],"install":{},"requirements":{"env":[],"upstreamMayCharge":false},"tools":null,"readme":"<p align=\"center\">\n  <img src=\"./logo.svg\" width=\"84\" height=\"84\" alt=\"plyxui\" />\n</p>\n\n<h1 align=\"center\">plyxui</h1>\n\n<p align=\"center\">\n  A component library that tries to be equally good for humans and AI agents.\n</p>\n\n<p align=\"center\">\n  <a href=\"https://plyxui.vercel.app\">Landing</a> &middot;\n  <a href=\"https://plyxui-docs.vercel.app\">Docs</a> &middot;\n  <a href=\"https://plyxui-releases.vercel.app\">Releases</a> &middot;\n  <a href=\"https://github.com/vineethpawar/ai-polish-desktop\">AI Polish (sibling)</a>\n</p>\n\n---\n\nMost libraries pick a lane. shadcn is built around copy-paste. Radix is built around correctness. Tamagui is built around its compiler. plyxui is built around one assumption: in 2026 the agent installing your component matters as much as the developer reading the docs.\n\n## Why I'm building this\n\nAfter shipping a few products on top of shadcn + Radix + bespoke Electron chrome, the same gaps kept showing up:\n\n1. The same components had to be rewritten three times: web, Electron renderer, VS Code webview. The first two are mostly the same with a few title-bar and IPC edges. The webview pretends to be web but isn't quite.\n2. Type intellisense degraded as the design system grew. Variants, tokens, icon names: all stringly typed eventually.\n3. Cursor and Claude Code consistently misimplemented components because they couldn't read the design system. They scraped HTML from a docs site and guessed.\n\nplyxui is an attempt to fix all three at once:\n\n- One source tree, platform splits via `.native.tsx`. Electron treats web as web. VS Code webview gets its own theme bridge.\n- `cva` for variants, branded tokens, module augmentation hooks. Autocomplete is the spec.\n- A first-party MCP server (`@plyxui/mcp`) so coding agents can list, search, install, and lint components conversationally.\n\n## Status\n\n0.1 cut across eleven packages. Tracker in `PLYXUI_PLAN.md`, full ladder at <https://plyxui-docs.vercel.app/getting-started/ladder/>.\n\n### Foundation\n\n- `@plyxui/core` — tokens (colors, spacing, radius), polymorphic helpers, module-augmentable token interfaces.\n- `@plyxui/styles` — ThemeProvider + useTheme. Follows OS preference until you toggle. Electron title-bar bridge baked in.\n- `@plyxui/primitives` — Box, Text, Stack, Flex, Input, Button. Web + native parity.\n- `@plyxui/icons` — registry-based Icon, augmentable name union, seed pack of 20.\n- `@plyxui/hooks` — useDisclosure, useClickOutside, useMediaQuery, useToast.\n\n### Mid-rung\n\n- `@plyxui/layouts` — AppShell, Sidebar, ScreenContainer.\n- `@plyxui/navigator` — router-agnostic defineRoutes + react-router / react-navigation adapters.\n- `@plyxui/forms` — Field, Select, Checkbox, Radio + RadioGroup.\n- `@plyxui/comps` — Modal, Dropdown. Tooltip + Tabs + Toast next.\n\n### High-rung\n\n- `@plyxui/screens` — AuthLayout, EmptyState, ErrorScreen.\n- `@plyxui/plugins` — CommandPalette. DataTable + Chart next.\n\n### Tooling\n\n- `@plyxui/mcp` — first-party MCP server. Tool surface defined; real handlers next.\n\nNot on npm yet. The 0.1 publish is gated on adding `NPM_TOKEN` to the repo secrets; the release workflow (`.github/workflows/release.yml`) is already wired via `changesets/action`.\n\n## Extending tokens\n\nTokens are interfaces, not enums. Augment them from userland and the rest of the library autocompletes against your brand:\n\n```ts\ndeclare module \"@plyxui/core\" {\n  interface OmniColorTokens {\n    brandTeal: string;\n    brandTealMuted: string;\n  }\n}\n\nimport { registerColorTokens } from \"@plyxui/core\";\n\nregisterColorTokens({\n  brandTeal:      { light: \"#0FAFA4\", dark: \"#3FD9CE\" },\n  brandTealMuted: { light: \"#E1F5F4\", dark: \"#0A2E2C\" },\n});\n```\n\nAfter registration, every `useTheme().colors.brandTeal` call is typed, and every `<Box surface=\"brandTeal\">` autocompletes.\n\n## Layout\n\n```\nplyxui/\n├── apps/\n│   ├── playground-web/      vite app, quick way to see primitives render\n│   ├── docs/                next + MDX docs site → plyxui-docs.vercel.app\n│   ├── landing/             product page → plyxui.vercel.app\n│   └── releases/            release index → plyxui-releases.vercel.app\n├── packages/\n│   ├── core/                tokens + types, zero DOM, zero RN\n│   ├── styles/              ThemeProvider with web + native splits\n│   ├── primitives/          Box, Text, Stack, Flex, Input, Button\n│   ├── hooks/               useDisclosure, useClickOutside, useToast\n│   ├── icons/               Icon component + registry + seed pack\n│   ├── layouts/             AppShell, Sidebar, ScreenContainer\n│   ├── navigator/           router-agnostic + adapters\n│   ├── forms/               Field, Select, Checkbox, Radio\n│   ├── comps/               Modal, Dropdown (more coming)\n│   ├── screens/             AuthLayout, EmptyState, ErrorScreen\n│   ├── plugins/             CommandPalette (heavyweight stuff)\n│   └── mcp/                 first-party MCP server\n├── turbo.json\n└── tsconfig.base.json\n```\n\n## Local dev\n\n```bash\nnpm install\nnpm run check-types\nnpm run dev --workspace=@plyxui/playground-web\n```\n\n## Roadmap\n\nFoundation + breadth + docs scaffold are in. Next stops:\n\n- MCP server: real handler implementations behind the tool signatures, then llms.txt at the docs root.\n- Composites: Tooltip, Tabs, Toast, Drawer.\n- Theme remix backend: publish a token + variant override bundle, share with a one-line `<ThemeProvider remixUrl=\"...\" />`.\n- Sprite-sheet codegen for heavy icon users.\n\nSee `PLYXUI_PLAN.md` for the running tracker.\n\n## Related\n\n- **[AI Polish](https://github.com/vineethpawar/ai-polish-desktop)** — sibling desktop app. Pick a project folder, paste an Anthropic key, hand the agent a Figma frame. Pairs nicely with plyxui but works on any codebase.\n\n## Prior art\n\nPatterns borrowed and lessons learned from shadcn, Radix, Tamagui, Mantine, react-native-reusables, assistant-ui, and the Anthropic MCP team. Everything good here is theirs. Everything weird is mine.\n\n## License\n\nMIT.\n"}