Agent Skills
› freestyle-voice/freestyle
freestyle-voice/freestyle
GitHub指导创建独特、生产级的前端界面，避免通用AI美学。适用于构建网页组件、页面或应用，强调大胆的审美方向、排版、色彩及动效细节，生成高质量视觉代码。
Install All Skills
npx skills add freestyle-voice/freestyle --all -g -y
Skills in Collection (8)
指导创建独特、生产级的前端界面，避免通用AI美学。适用于构建网页组件、页面或应用，强调大胆的审美方向、排版、色彩及动效细节，生成高质量视觉代码。
用户要求构建Web组件或页面
需要美化或设计UI界面
请求生成React/Vue/HTML/CSS布局
npx skills add freestyle-voice/freestyle --skill frontend-design -g -y
提供 Hono Web 应用开发的 API 参考与 CLI 使用指南，涵盖路由、中间件、测试及上下文处理。
构建 Hono 应用
查询 Hono API 或路由配置
代码中导入 hono 模块
npx skills add freestyle-voice/freestyle --skill hono -g -y
管理 shadcn/ui 组件库，支持添加、搜索、调试和样式调整。提供项目上下文、组件文档及使用示例，遵循组合优于重写的原则，规范 Tailwind 样式与表单结构，提升 UI 开发效率。
使用 shadcn CLI 添加或搜索组件
初始化 shadcn 项目 (--preset)
修复或调试 shadcn 组件样式问题
项目中存在 components.json 文件
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
审查UI代码是否符合Web界面指南，支持检查可访问性、UX审计及最佳实践合规性。通过获取最新规则并比对指定文件，以简洁格式输出问题发现。
review my UI
check accessibility
audit design
review UX
check my site against best practices
npx skills add freestyle-voice/freestyle --skill web-design-guidelines -g -y
提供UI/UX设计智能支持，涵盖84种风格、配色、字体及22种技术栈的组件与规范。用于页面设计、组件重构、视觉审查、交互优化及无障碍检查，辅助前端开发与设计决策。
需要设计新页面或调整布局时
进行UI组件创建或重构时
审查界面的无障碍性或一致性时
选择配色方案或排版系统时
npx skills add freestyle-voice/freestyle --skill ui-ux-pro-max -g -y
