Communitygithub.com

siddhantmani/reactvibe

React 动画库,提供可复制粘贴的 UI 组件。基于 Framer Motion 和 Tailwind 构建,开源且生产就绪。

reactvibe 是什么?

React Vibe 是一个开源的 React 动画库,专注于提供可直接复制粘贴的 UI 组件,无需安装任何包。它基于 Framer Motion、Three.js 和 Tailwind CSS 构建,适用于现代 Web 应用。该库包含动画组件、背景效果、页面区块(如 Hero、定价、推荐)以及文字动画等,每个组件都自包含、易于集成且完全可定制。React Vibe 的设计理念是让开发者拥有对代码的完全控制权,避免依赖锁定和版本问题,特别适合那些注重交互、动效和性能的开发者。它支持 React、Next.js 和 TypeScript,适用于 SaaS 应用、仪表盘和落地页等场景。

兼容平台~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/siddhantmani/reactvibe/tree/main

在你喜欢的 AI 中提问

打开一个已预加载此 Agent Skill 的新对话。

预览

来自技能 README

reactvibe preview

文档


👋 关于

React Vibe 是一个开源的 React 动画库,专注于构建动画 React 组件、UI 区块和交互模式,让它们感觉流畅且富有意图。

与传统的 React UI 库不同,React Vibe 为你提供:

  • 可复制粘贴的 React 组件(无需安装包)
  • 对代码和样式的完全控制
  • 为实际应用打造的干净、可复用的 React 组件

专为关心交互、动效和性能的开发者打造。


⭐ 为什么选择 React Vibe

  • React 动画库 — 基于 Framer Motion 和现代动画模式构建
  • 可复制粘贴的 React 组件 — 无锁定,无隐藏抽象
  • 生产就绪的 React 组件 — 适用于 SaaS 应用、仪表盘和落地页
  • 可复用的 React 组件 — 干净、可扩展且易于修改
  • Tailwind React 组件 — 快速样式,完全灵活
  • 开源 React UI 库 — 免费使用和定制

🧩 组件与 UI 分类

React Vibe 包含一个不断增长的集合:

  • 动画 React 组件
  • 适用于网站和 SaaS 应用的 React UI 组件
  • 背景动画(Three.js + 动效)
  • Hero 区块和落地页 UI 模块
  • 定价区块、推荐和行动号召
  • 文字动画组件

每个组件都设计为:

  • 自包含
  • 易于集成
  • 完全可定制

🚀 使用方法

React Vibe 不是一个传统的 React 组件库。

无需安装包,你只需:

  1. 复制组件代码
  2. 粘贴到你的项目中
  3. 自由定制

这种方式为你提供了:

  • 对 React 组件的完全控制
  • 无依赖开销
  • 无版本锁定

大多数组件使用:

  • Framer Motion React 动画
  • Three.js 实现高级视觉效果
  • Tailwind CSS UI 样式

🛠 技术栈

  • React
  • Next.js
  • TypeScript
  • Tailwind CSS
  • Framer Motion
  • Three.js

⭐ 支持

如果 React Vibe 对你有帮助:

👉 给仓库点星 — 这有助于这个 React UI 库触达更多开发者。


🤝 贡献

欢迎贡献。

  • 针对 Bug 或想法提交 Issue
  • 提交 PR 以添加新组件或改进

请确保贡献内容符合以下原则:

干净的代码 · 可复用的 React 组件 · 高质量动画


📄 许可证

MIT 许可证

相关技能