ckm:ui-styling - UI样式设计与shadcn/ui组件库
使用shadcn/ui组件、Tailwind CSS实用样式和画布视觉设计创建可访问的用户界面
标签
更新于: 2026-06-30能力
典型输入
典型输出
该技能可以做什么
- 创建UI组件
- 样式化界面
- 构建布局
- 实现暗黑模式
- 自定义主题
- 添加可访问组件
- 设计视觉构图
- 生成海报
- 原型界面
- 配置主题
- 管理组件
- 创建响应式布局
- 实现表单验证
- 添加导航模式
- 创建数据表格
输入
- shadcn/ui组件
- 组件名称
- 布局规范
- 主题偏好
- 设计令牌
- 配色方案
- 排版设置
输出
- UI组件代码
- 样式化界面
- 布局代码
- 主题配置
- 视觉设计
- 响应式布局
- 可访问组件
要求
- React框架（Next.js、Vite、Remix、Astro）
- TypeScript支持
- Node.js环境