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组件或页面
生成React/Vue代码
美化Web UI界面
npx skills add freestyle-voice/freestyle --skill frontend-design -g -y
提供 Hono Web 应用的开发指南,涵盖路由、中间件、JSX 及 API 参考。支持通过 CLI 测试端点,适用于构建基于 Hono 的轻量级后端服务。
用户询问 Hono 框架相关 API 或用法
代码中导入 'hono' 或 'hono/*'
需要测试 Hono 应用端点
npx skills add freestyle-voice/freestyle --skill hono -g -y
管理 shadcn/ui 组件与项目,支持添加、搜索、修复、调试、样式调整及组合 UI。提供项目上下文、组件文档和使用示例,适用于涉及 shadcn/ui 的项目开发。
需要添加或管理 shadcn/ui 组件
使用 shadcn CLI 初始化或配置项目
查找和集成 UI 组件
解决 UI 样式或布局问题
npx skills add freestyle-voice/freestyle --skill shadcn -g -y
提供React组件组合模式指南,解决布尔属性泛滥问题。适用于重构复杂组件、构建可复用库及设计灵活API,涵盖复合组件、状态提升与React 19新特性。
重构具有大量布尔属性的组件
构建可复用的组件库
审查或设计组件架构
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 应用开发的最佳实践,涵盖列表性能优化、动画实现、导航配置及原生模块集成,旨在提升移动端应用的性能与用户体验。
构建 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
提供涵盖22种技术栈的UI/UX设计智能查询,包含84种风格、配色、字体及UX规范。用于页面与组件设计、视觉决策、交互模式定义及用户体验审查,支持无障碍、布局、动画等优先级规则指导。
设计新页面或重构UI组件
选择颜色、排版或布局系统
审查UI的可访问性与一致性
实现导航或动画效果
npx skills add freestyle-voice/freestyle --skill ui-ux-pro-max -g -y


