Agent Skills
› freestyle-voice/freestyle
freestyle-voice/freestyle
GitHub用于创建独特且生产级的前端界面，避免通用AI美学。指导用户构建网页组件、页面或应用，强调大胆的美学方向、排版、色彩及动效细节，生成高质量UI代码。
Install All Skills
npx skills add freestyle-voice/freestyle --all -g -y
Skills in Collection (8)
用于创建独特且生产级的前端界面，避免通用AI美学。指导用户构建网页组件、页面或应用，强调大胆的美学方向、排版、色彩及动效细节，生成高质量UI代码。
需要构建网页组件或页面
要求美化或设计Web UI
npx skills add freestyle-voice/freestyle --skill frontend-design -g -y
提供 Hono Web 框架的内联 API 知识，涵盖路由、中间件、上下文及 CLI 测试命令，辅助构建和调试基于 Hono 的应用程序。
代码导入 'hono' 或 'hono/*'
用户询问 Hono API、路由、中间件或测试
npx skills add freestyle-voice/freestyle --skill hono -g -y
管理shadcn/ui组件，支持添加、搜索、调试和样式调整。提供项目上下文、组件文档及使用示例，指导基于CLI进行UI构建与组合，避免重复造轮子。
使用 shadcn/ui 或 component registries
存在 components.json 文件的项目
执行 shadcn init 或 create app with --preset
npx skills add freestyle-voice/freestyle --skill shadcn -g -y
提供React组件组合模式指南，解决布尔属性泛滥问题。适用于重构、构建可复用库及设计API，涵盖复合组件、状态提升与React 19新特性。
重构含多布尔属性的组件
构建可复用组件库
审查组件架构
使用复合组件或Context Provider
npx skills add freestyle-voice/freestyle --skill vercel-composition-patterns -g -y
基于Vercel工程团队的React和Next.js性能优化指南，涵盖消除瀑布流、包体积优化及服务端性能等70条规则，用于指导代码编写、审查与重构。
编写或重构React组件及Next.js页面
实施数据获取逻辑
审查代码以发现性能问题
优化打包体积或加载速度
npx skills add freestyle-voice/freestyle --skill vercel-react-best-practices -g -y
提供 React Native 和 Expo 应用开发的最佳实践指南，涵盖性能优化、动画实现、UI 模式及原生模块配置等核心规则。
构建 React Native 或 Expo 应用
优化列表滚动性能
使用 Reanimated 实现动画
处理原生模块或字体配置
npx skills add freestyle-voice/freestyle --skill vercel-react-native-skills -g -y
该技能用于审查Web界面代码是否符合设计规范。通过获取最新指南，检查指定文件，并以简洁格式输出合规性问题，适用于UI审查、无障碍检查和UX审计场景。
审查UI代码
检查无障碍性
审计设计
审查用户体验
根据最佳实践检查网站
npx skills add freestyle-voice/freestyle --skill web-design-guidelines -g -y
提供Web和移动端UI/UX设计智能支持，涵盖84种风格、192色板及多框架规范。用于页面与组件设计、视觉决策、交互模式制定及用户体验审查，确保可访问性与一致性。
进行UI结构或视觉设计决策
审查界面可用性、无障碍性或一致性
选择配色、排版或布局系统
实现导航、动画或响应式行为
npx skills add freestyle-voice/freestyle --skill ui-ux-pro-max -g -y
