{"_id":"@achmadalimin/ui-kit-mcp","_rev":"2-57e551482f2eff235a3b470e27ed99e2","name":"@achmadalimin/ui-kit-mcp","dist-tags":{"latest":"1.1.0"},"versions":{"1.0.0":{"name":"@achmadalimin/ui-kit-mcp","version":"1.0.0","keywords":["mcp","model-context-protocol","design-system","ui","components","css","ai"],"author":{"url":"https://achmadalimin.com","name":"Achmad Alimin","email":"contact@achmadalimin.com"},"license":"MIT","_id":"@achmadalimin/ui-kit-mcp@1.0.0","maintainers":[{"name":"achmadalimin","email":"achmad.alimin29@gmail.com"}],"homepage":"https://achmadalimin.com/design-system","bugs":{"url":"https://github.com/merahburam/achmadalimin-ui-kit-mcp/issues"},"bin":{"ui-kit-mcp":"index.js"},"dist":{"shasum":"1c45584be700ccf22d11af7f5bad11488020e8de","tarball":"https://registry.npmjs.org/@achmadalimin/ui-kit-mcp/-/ui-kit-mcp-1.0.0.tgz","fileCount":5,"integrity":"sha512-j/lya9c441vBtESJHKPiAbxb8RCDoXmSE/WaOTrxWTe5QqP4iKNohx7HW3GHQo0gUMpL7UVUomZ7A/CTQ7MWKw==","signatures":[{"sig":"MEQCIDPz3U4I+feBCg2ZxJ8PXyXi7qtIT9WfeJ+1mV4g9I+NAiANJZgIZoaLDvR7bThZFCA7+oN0y5TCwrNazHZISUVggA==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":19517},"type":"module","engines":{"node":">=18"},"_npmUser":{"name":"achmadalimin","email":"achmad.alimin29@gmail.com"},"repository":{"url":"git+https://github.com/merahburam/achmadalimin-ui-kit-mcp.git","type":"git"},"_npmVersion":"10.9.8","description":"Make Achmad Alimin's design system (@achmadalimin/ui-kit) AI-native. Gives Claude, Cursor, and Windsurf the real component markup and tokens via the Model Context Protocol.","directories":{},"_nodeVersion":"22.22.3","dependencies":{"@modelcontextprotocol/sdk":"^1.12.0"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"_npmOperationalInternal":{"tmp":"tmp/ui-kit-mcp_1.0.0_1780131843525_0.6685386005475096","host":"s3://npm-registry-packages-npm-production"}},"1.1.0":{"name":"@achmadalimin/ui-kit-mcp","version":"1.1.0","description":"Make Achmad Alimin's design system (@achmadalimin/ui-kit) AI-native. Gives Claude, Cursor, and Windsurf the real component markup and tokens via the Model Context Protocol.","type":"module","bin":{"ui-kit-mcp":"index.js"},"dependencies":{"@modelcontextprotocol/sdk":"^1.12.0"},"engines":{"node":">=18"},"license":"MIT","author":{"name":"Achmad Alimin","email":"contact@achmadalimin.com","url":"https://achmadalimin.com"},"homepage":"https://achmadalimin.com/design-system","repository":{"type":"git","url":"git+https://github.com/merahburam/achmadalimin-ui-kit-mcp.git"},"keywords":["mcp","model-context-protocol","design-system","ui","components","css","ai"],"publishConfig":{"access":"public"},"_id":"@achmadalimin/ui-kit-mcp@1.1.0","gitHead":"d71b675773969f37eb11bdc56d92e51707a9b3c2","bugs":{"url":"https://github.com/merahburam/achmadalimin-ui-kit-mcp/issues"},"_nodeVersion":"22.22.3","_npmVersion":"10.9.8","dist":{"integrity":"sha512-2KL8XNtuTeAxfiZg8tkx2Cc3iQ00aPd5EQ07lsVfEvt+Uf2/DRausiO5MYceybcOBVK1S28egPjDscLLwmJjUQ==","shasum":"aa544f0b330186f7e622bd9108ab1f569ad8b930","tarball":"https://registry.npmjs.org/@achmadalimin/ui-kit-mcp/-/ui-kit-mcp-1.1.0.tgz","fileCount":5,"unpackedSize":22167,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQDq+5n87I3TFD3D/AgWqhA3z1luDZtW8DuoRElMcH4VzwIgdXwSu0/28OTDZXjJDU8jMngYyJdGVwNkX/glymbLyXU="}]},"_npmUser":{"name":"achmadalimin","email":"achmad.alimin29@gmail.com"},"directories":{},"maintainers":[{"name":"achmadalimin","email":"achmad.alimin29@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/ui-kit-mcp_1.1.0_1780753597921_0.7320615981246501"},"_hasShrinkwrap":false}},"time":{"created":"2026-05-30T09:04:03.424Z","modified":"2026-06-06T13:46:38.199Z","1.0.0":"2026-05-30T09:04:03.672Z","1.1.0":"2026-06-06T13:46:38.056Z"},"bugs":{"url":"https://github.com/merahburam/achmadalimin-ui-kit-mcp/issues"},"author":{"name":"Achmad Alimin","email":"contact@achmadalimin.com","url":"https://achmadalimin.com"},"license":"MIT","homepage":"https://achmadalimin.com/design-system","keywords":["mcp","model-context-protocol","design-system","ui","components","css","ai"],"repository":{"type":"git","url":"git+https://github.com/merahburam/achmadalimin-ui-kit-mcp.git"},"description":"Make Achmad Alimin's design system (@achmadalimin/ui-kit) AI-native. Gives Claude, Cursor, and Windsurf the real component markup and tokens via the Model Context Protocol.","maintainers":[{"name":"achmadalimin","email":"achmad.alimin29@gmail.com"}],"readme":"# @achmadalimin/ui-kit-mcp\n\nMake the [@achmadalimin/ui-kit](https://achmadalimin.com/design-system) design\nsystem AI-native. This MCP server gives Claude, Codex, Cursor, and Windsurf the\n**real** component markup and design tokens — so when you ask your AI to build UI\n\"using Achmad's design system,\" it uses the actual `ui-kit` components instead of\ninventing generic markup.\n\nFree and open. No license key, no account, no network calls — the component\ncatalog ships inside the package.\n\n## Tools\n\n| Tool | What it does |\n|---|---|\n| `list_components` | Lists every component with a one-line description |\n| `get_component` | Returns the canonical HTML, classes, and any required script for one component |\n| `get_tokens` | Returns the design tokens (CSS custom properties) + theming notes |\n| `get_setup` | Returns install/import instructions so the stylesheet is actually loaded |\n\n## Requirements\n\n- Node.js 18+\n- Claude Desktop, Codex, Cursor, or Windsurf\n\n## Setup\n\n### Claude Desktop\n\nEdit `~/Library/Application Support/Claude/claude_desktop_config.json` (macOS) or\n`%APPDATA%\\Claude\\claude_desktop_config.json` (Windows):\n\n```json\n{\n  \"mcpServers\": {\n    \"achmad-ui-kit\": {\n      \"command\": \"npx\",\n      \"args\": [\"@achmadalimin/ui-kit-mcp\"]\n    }\n  }\n}\n```\n\nRestart Claude Desktop.\n\n### Codex\n\nCodex uses TOML (not JSON). Edit `~/.codex/config.toml` (shared by the Codex app,\nCLI, and IDE extension):\n\n```toml\n[mcp_servers.achmad-ui-kit]\ncommand = \"npx\"\nargs = [\"@achmadalimin/ui-kit-mcp\"]\n```\n\nOr run `codex mcp add achmad-ui-kit -- npx @achmadalimin/ui-kit-mcp`, then restart Codex.\n\n### Cursor\n\nEdit `~/.cursor/mcp.json`:\n\n```json\n{\n  \"mcpServers\": {\n    \"achmad-ui-kit\": {\n      \"command\": \"npx\",\n      \"args\": [\"@achmadalimin/ui-kit-mcp\"]\n    }\n  }\n}\n```\n\n### Windsurf\n\nEdit `~/.codeium/windsurf/mcp_config.json` with the same `mcpServers` block.\n\n## Usage\n\nOnce connected, prompt your AI naturally:\n\n> \"Build a settings page using Achmad's ui-kit — a card with a couple of inputs and a save button.\"\n\nThe AI calls `get_setup`, `list_components`, and `get_component` to pull the real\nmarkup, classes, and the stylesheet link.\n\n## The design system\n\n`@achmadalimin/ui-kit` is plain HTML + CSS — no framework, no runtime. Install it\nwith `npm install @achmadalimin/ui-kit` or grab the standalone stylesheet:\n\n```bash\ncurl -O https://achmadalimin.com/assets/css/ui-kit.css\n```\n\nFull docs and live previews: **[achmadalimin.com/design-system](https://achmadalimin.com/design-system)**\n\n## License\n\nMIT © Achmad Alimin\n","readmeFilename":"README.md"}