DESIGN/设计资源·UI-KIT
DavidHDev/react-bits
4.8万 star,不到一年,这个React动画组件库凭什么?48,458 stars in 8 months — what's this React component library doing right?
一个开源的React组件库,帮开发者快速添加动画和交互效果。An open-source collection of animated, interactive, and fully customizable React components for building memorable websites.
怎么装:Install: npx shadcn@latest add @react-bits/BlurText-TS-TW
02 / 现在的位置02 / Why now
首次发现FIRST SEEN
03 OCT 202603 OCT 2026
增长GROWTH
+0.1%+0.1%
48k → 48k stars · 2 个快照48k → 48k stars · 2 snapshots
讨论DISCUSSION
1 SOURCES1 SOURCES
1 条外部提及1 external mentions
状态STATUS
持续活跃Active
质量 AQuality A
star数达到48458,社区认可度高Gained over 48,000 GitHub stars in 8 months.
HN_STORY · 2 points · 0 comments
03 / 它能帮你做什么03 / What it helps you do
用现成组件快速搭建动画网页
自由调整组件样式和交互
通过命令行一键添加组件
使用免费工具加速设计流程
构建令人难忘的互动网站
Add animated text effects to React pages.
Create interactive 3D elements with CSS.
Customize components using Tailwind CSS classes.
Build memorable website interactions quickly.
04 / 安装04 / Install
$ README 里给出的安装方式。The installation method given in the README.
两种装法选一个即可 —— 上面那条给命令行用户,下面那条给写代码的用户。Pick one of the two — the first is for command-line users, the second for people writing code.
使用 npx shadcn@latest add @react-bits/BlurText-TS-TW 安装You can add components via shadcn CLI with a command like `npx shadcn@latest add @react-bits/BlurText-TS-TW`.
05 / 限制与风险05 / Limits and risk
风险不是警告,是可信度的一部分。以下结论只基于文档静态扫描,我们不会执行项目里的任何代码。Risk here is evidence, not an alarm. These findings come from static scanning of the docs; we never execute a project’s code.
限制LIMITS
未知Unknown
静态扫描STATIC SCAN
在 README、SKILL.md 和依赖清单中没有匹配到已知风险模式。No known risk patterns matched in the README, SKILL.md or dependency list.这不等于安全that does not mean it is safe,只能说明文档里没写。 — only that the docs do not mention it.
静态扫描未发现明显风险,但不代表安全A static scan of the documentation found no known risk patterns, but this does not guarantee the code is safe.
这里只做静态扫描:读 README、SKILL.md 和依赖清单,不执行代码。没有命中不代表安全。This is static scanning only: we read the README, SKILL.md and dependency list, and never execute code. No findings does not mean safe.
依赖:Dependencies:@chakra-ui/react, @emotion/react, @gsap/react, @hugeicons/core-free-icons, @hugeicons/react, @react-three/drei, @react-three/fiber, @react-three/postprocessing, @react-three/rapier, @tailwindcss/vite, @use-gesture/react, class-variance-authority
{
"agents": [
{
"agent": "claude-code",
"evidence": "tree: .claude/"
}
],
"apiKey": null,
"docker": null,
"taxonomy": {
"scores": {
"design": 6,
"ai-tools": 0,
"dev-tools": 1,
"indie-web": 0,
"skill-agent": 0,
"productivity": 0
},
"primary": "design",
"secondary": "ui-kit"
},
"localRuntime": null,
"skillMdTotal": 0,
"skillMdErrors": [],
"treeTruncated": false,
"categoryScores": {
"data": 0,
"agent": 0,
"media": 1,
"design": 12,
"browser": 0,
"devtool": 1,
"security": 0,
"marketing": 0,
"productivity": 0
},
"classification": [],
"scannedSources": [
"readme"
],
"skillMdFetched": 0
}