Originkit：本站背景的粒子，就是从这抄的
先说这东西是什么
Originkit（originkit.dev）是一个面向现代网站的动画 / 特效组件库，自我定位是"Free Animated component library"。规模不小：654 个组件，而且不是凑数的小挂件——光"背景"一个分类就有 227 个。
按分类列一下（官方计数）：
| 分类 | 数量 | 分类 | 数量 |
|---|---|---|---|
| 背景 Background | 227 | 图片 Image | 43 |
| 交互元素 Interactive | 110 | 加载 Loader | 28 |
| 文字 Text | 77 | 光标 Cursor | 23 |
| 动画 Animations | 69 | 按钮 Button | 21 |
| 图片画廊 Gallery | 45 | 游戏 Games | 7 |
我的用法：这里进过货
本站背景那片缓慢漂移、邻近点自动连线、鼠标划过就被点亮并拉出光线的小星网——不是我自己设计的，是从 Originkit 的 Particle Drift（WebGL 星网背景）改编来的。
准确说不是"复制粘贴"：本站是零依赖的手写站，直接塞 React 组件不现实，我是把它当"图纸"，照着重写了一遍无框架的 WebGL 版本。它的组件页本身就好用在这一点上：
- 参数表就是规格书。density 400、dotSize 6、linkDistance 230、speed 50、direction 0（0 就是笔直向下）……我几乎是对着这张表实现自己的版本，再按本站的克制程度调参（密度更低、速度更慢、加了双主题配色）。
- 特性列表里全是工程细节，比效果本身还值钱：线段在顶点着色器里展成带羽化的三角面片、点精灵裁成平滑圆，整场一次绘制；缓冲区按上限一次分配，运行帧里零分配；运动按"每秒"积分而不是"每帧"，所以 60Hz 和 120Hz 屏幕上速度一致；从一边飘出去的点会从对边带着新的横向位置回来，场子永远跑不出重复的轨道。
这几条后来都直接进了我们那个版本的实现里（前台效果什么的倒是次要的，这些才是它值钱的地方）。
怎么逛、怎么用
- 每个组件页就是一间实时实验室：效果在跑，旁边的面板可以调颜色、密度、速度、方向、线宽；还有 Helper Mode 和响应式编辑器。
- 挑好之后点 Get this component，四种拿法：CLI（
bunx --bun originkit@latest add particle-drift）、直接复制代码、MCP、AI Prompt——React 项目里基本是"调好参数 → 一条命令"。 - 榜单当逛店指南很好用：Trending / Recently Added / Most Copied / Last 7 Days / Recommended。复制量可以当口碑参考：Tornado 17.6k、Glass Icon 8.6k、Cursor Ring Field 8.4k；我进的那个 Particle Drift 也有 3.3k。
免费的部分已经够用
组件分两档：免费的直接可拿，带皇冠 Pro 标的要付费。我的感受是免费池子的质量已经"超级好"——Cursor Ring Field、Cloud Sky、Particle Drift 这些高复制量的都不带 Pro 标，参数调一调就是成品级；Particle Drift 页面上连"为什么这么写"都写清楚了，抄得心服口服。
另外它还配了个 3D 工具 Thrine：把 logo 或文字转成可嵌入的 3D 资产，站内有入口。
一句总结
想给网站补一点"活"的感觉、又不想从零写 shader 的话，这里的免费组件够你把整站武装一遍。本站的背景只是进了它一次货——估计以后还得去。