React Bits

项目概述

React Bits 拥有超 4.6 万 GitHub Stars，是目前全球最火爆的 React 动效与交互组件库之一。收录了上百款高水准的文字打字机流光动效、WebGL 动态背景、磁吸按钮与 3D 悬浮卡片。

核心特性

• ⚡️ 100+ 款高阶视觉动效：涵盖渐隐文字、磁吸按钮、卡片倾斜重力感应与光标跟随轨迹。
• 酷炫 WebGL 与 Shader 背景：内置极光波浪、流动渐变与赛博故障风动态 Canvas 背景。
• 现代化 CLI 与源码拷贝：支持通过 jsrepo 命令行一键拉取组件，代码完全自主掌控。
• Tailwind 原生适配：样式与 Tailwind CSS 无缝契合，开箱即用。

快速上手与示例代码

npx jsrepo add https://reactbits.dev/r/decaying-card

import DecayingCard from '@/components/DecayingCard';

export default function HeroSection() {
  return <DecayingCard image="/hero.jpg" title="极致动效" />;
}

技术选型建议与适用场景

• 非常适合：Awwwards 级创意网站、品牌营销落地页、AI 产品首页大 Hero 区域及设计师作品集。
• 不适用场景：对交互动效有严格限制、追求极端极简低算力消耗的传统政企报表系统。