用途:为构建 Anthropic Claude 驱动的应用提供 UI/UX 框架,包含 React 组件、Tailwind CSS 工具类、截图转 React、Figma 集成以及 Artifacts 风格渲染。
主要能力:Artifacts UI 引擎可渲染 AI 生成内容并实时预览;StreamChat 组件处理 Claude 流式响应并带打字动画;screenshotToReact 将截图或设计稿转为 React 代码;figmaToReact 从 Figma 导出组件;提供 useClaudeStream、useDarkMode、useResponsiveLayout、useAIConfidence 等自定义 Hook;支持 shadcn/ui 集成、SVG 图标生成、Markdown 与 LaTeX 渲染、基于 AI 置信度的自适应配色。
使用方式:可从 releases 下载预构建包,或克隆仓库后安装依赖。常用命令:npm run dev、npm run build、npm run preview。需在 .env 中配置 ANTHROPIC_API_KEY,Figma 集成可选配置 FIGMA_API_TOKEN。Tailwind 需在配置中引入 claudeDesignPreset。
适用场景:需要为 Claude 应用快速搭建聊天界面、代码/文档预览、设计稿转代码等前端场景。
限制:资料未提供收费、价格、平台支持范围与效果保证等信息;截图转换建议图片不超过 5MB 且为图片类型;渲染 AI 生成内容前应做净化以防 XSS。