Basiiik

io.github.shubhankarsd由 GitHub 账号 shubhankarsd 发布v0.8.0更新于 Nov 3, 2026

Design system for coding agents: component specs, rules, tokens, icons and checked React snippets.

已验证STDIO仅桌面开发者工具媒体与设计

概览

AI 生成的概览

Basiiik 为编码助手提供设计系统参考：组件规范、使用规则、设计令牌、图标以及经过校验的 React 代码片段。

可以做什么
  • 读取生成 UI 的设计系统规则，包括主题与无障碍要求
  • 按分类或状态浏览、筛选并搜索 88 个组件，并获取单个组件的完整规范
  • 生成 import 与 JSX 用法片段，属性会按真实组件 API 校验
  • 搜索并获取图标，包括 SVG、React 用法与无障碍说明
  • 列出并查询设计令牌，含 CSS 变量与明暗主题取值
适用场景
适合助手基于 Basiiik 设计系统编写 React UI 代码时使用，让它选用真实存在的组件、令牌和图标而不是自行编造。在需要与设计系统保持一致的界面开发任务前添加最合适。
运行要求
以本地 stdio 进程运行，从 npm 包 @basiiik/mcp 安装，需要 Node.js。未声明任何认证、环境变量或请求头。仅支持桌面端，无网页可执行版本。
安装前请注意
仅提供只读的参考查询，未描述凭据、支付或数据写入行为。片段与规范均针对 Basiiik 系统，生成的代码会与该组件库绑定。

安装

在 SourceWeft 中

  1. 打开 控制台中的 Basiiik，将其添加到工作区。
  2. 为需要使用其工具的对话启用该服务。

Desktop only，通过 STDIO。 STDIO 服务会启动本地进程，因此需要 SourceWeft 桌面宿主。

工具

9

get_design_system_guide

Design system guide

The rules for generating UI with Basiiik: components first, tokens only, theming, accessibility. Read this before writing UI code.

无需输入参数。

list_components

List components

List Basiiik components (88). Filter by category (actions, agents, data-display, feedback, inputs, navigation, overlays) or implementation status.

输入参数statuscategory

search_components

Search components

Find the right component for a need, e.g. "confirm destructive action" or "show progress". Ranks by name, summary and when-to-use guidance.

输入参数limitquery必填

get_component

Get component spec

Full spec for one component: when to use it, when not to, React props and their allowed values, accessibility rules, Figma variants and the tokens it uses. Accepts a slug, name or React component name.

输入参数idnameslugcomponent

get_component_snippet

Get component snippet

Generate an import and JSX usage snippet. Props are validated against the real component API, so invalid props or values return an error listing what is allowed, and a required prop you leave out (such as aria-label on IconButton) is filled with its example value and listed in the notes, so you always get code to adapt.

输入参数idnameslugpropschildrencomponent

search_icons

Search icons

Find an icon for a need or a word, e.g. "delete", "go back" or "warning" (52 icons, 16px outline). Matches names, synonyms and use text. Use this instead of drawing or inventing SVGs. Leave query empty and pass a category (actions, navigation, objects, status) to list one category.

输入参数limitquerycategory

get_icon

Get icon

One icon: its SVG, React import and usage, when to use it and when not to, and accessibility notes. Accepts a name ("trash"), a component name ("TrashIcon") or a loose phrase.

输入参数idiconnameslug

list_tokens

List design tokens

List tokens with their CSS variable and Light and Dark values. Filter by layer (semantic tokens are what product code should use), type, dotted-name prefix such as "color.text", or free-text search.

输入参数typelayerlimitprefixsearch

get_token

Get one token

One token by dotted name ("color.text.primary") or CSS variable ("--color-text-primary" or "var(--color-text-primary)").

输入参数idnameslugtoken

版本历史

3
  1. v0.8.0最新Oct 29, 2026
  2. v0.6.0Oct 26, 2026
  3. v0.5.0Oct 25, 2026

评分

已满足适用检查项的 65%

该评分衡量此收录条目的完整程度，依据注册中心条目、端点与公开来源计算得出。它不是对服务器本身的评价，也不表示服务器安全或当前可用：可连通性是带日期的检查结果，评分也不包含安装量或用户评价。

  • 近 30 天内可连通25 分
  • 已声明认证方式10 分

    请在注册中心条目中声明凭据请求头，或保持端点能够响应探测，以便判定其认证方式。

  • 已列出工具必需15 分
  • 描述必需15 分
  • 图标10 分
  • 文档15 分

    请声明包含 README 的 GitHub 仓库，或在 OAuth 受保护资源元数据中提供 resource_documentation。

  • 许可证10 分

    请在仓库或注册中心条目中声明许可证。