周活跃用户
8,642+12.4%
AI 原生
AI 总览 ai-overview AI 会话 ai-chat AI 消息 ai-message AI 推理 ai-reasoning AI 输入台 ai-composer AI 工具调用 ai-tool-call AI 子智能体 ai-subagent AI 差异审阅 ai-diff AI 文件标签 ai-files AI 任务清单 ai-todo AI 用量条 ai-usage AI 上下文面板 ai-context 会话列表 ai-threads 回答反馈 ai-feedback 分支切换 ai-branch知识库
知识库总览 kb 行内引用 kb-citation 来源列表 kb-sources 原文定位 kb-passage 来源冲突 kb-conflict 解析管线 kb-pipeline 分段编辑器 kb-chunks 分段策略 kb-segment 数据源连接 kb-connector 元数据 kb-metadata QA 对 kb-qa 检索调试台 kb-retrieval 过滤构建器 kb-filter 重排对比 kb-rerank 召回测试 kb-hittest SQL 卡片 kb-sql 问数答案 kb-answer 澄清反问 kb-clarify 口径解释 kb-explain 调用链追踪 kb-trace 标注队列 kb-review 无答案分析 kb-gap 评估对比 kb-eval 双栏工作台 kb-canvas 检查点 kb-checkpoint 沙箱工具容器 kb-sandbox 工具链条 kb-chain 文档权限面板 kb-acl 有效权限检查器 kb-who-can 访问申请流 kb-access 权限审计时间线 kb-audit 检索可见性对照器 kb-visibility表单
表单布局 form 输入框 input 选择器 select 滑块 slider 标签输入 tag-input 开关与选择 switch 分段选择 segmented 上传 upload 日期选择 date-picker数据展示
卡片 card 空状态 empty 头像 avatar 媒体卡 media-card 评分 rating 键盘键 kbd 列表 list 折叠面板 accordion 时间线 timeline 描述列表 desc 树形 tree 轮播 carousel 徽标 badge 滚动容器 scroll-area 表格 table 数据表格 datatable图表
图表总览 charts 折线图 chart-line 柱状图 chart-bar 饼图 chart-pie 雷达图 chart-radar 热力图 chart-heatmap 面积图 chart-area 堆叠条 chart-stack 仪表盘 chart-gauge 迷你趋势 chart-sparkline 散点气泡 chart-scatter 贡献日历 chart-calendar 知识图谱 chart-graph 嵌入地图 chart-map
设计 tokens(6 预设 × 明暗)× 无框架组件 × AI 原生族(7 态状态机 / 多模态 / 定价审计)
× 图表通用层(ChartSpec 纯 JSON)。全部消费同一套 --token-*,换肤零改动;
UI 能力可直接注册为模型调用的工具。
SHOWCASE · 精选组件
这里没有一个截图 —— 每个组件都由 @icen.ai/ui 当场渲染,可以直接点击、拖动、输入。悬停任意卡片查看组件名。
周活跃用户
部署成功 新
gateway · 32 秒前
4.5 · 128 条评价
构建中
命令面板
TOKENS · 三层正交
色彩预设 × 明暗 × 风格 profile 互不耦合。点一张色板 —— 整站包括上面的每张卡片,即刻换肤。
115 个组件共享同一套 --token-* —— 换肤不改一行组件代码。
WHY · 设计哲学
7 态状态机 + 多模态内容模型(对标 AI SDK v5 / MCP / OpenAI / Anthropic)+ 定价审计闭环,零接线一行绑定。
renderChart 吃纯 JSON ChartSpec,12 种图;悬停 / 单击 / 双击 / 右键事件与图例眼睛内建。
色彩预设 × 风格 profile × 明暗,三层互不耦合;115 个组件共享同一套 --token-*,换肤零改动。
纯 CSS class 契约 + 按需 behavior JS,SSR 安全;React / Vue / 原生都能接,类型面(.d.mts)随包发布。
bun add @icen.ai/ui pnpm add @icen.ai/ui npm install @icen.ai/ui yarn add @icen.ai/ui import '@icen.ai/ui/tokens.css';import '@icen.ai/ui/ui.css'; <html> 上挂预设与明暗类<html class="piano dark"> … </html>