Components

React 动效组件与零依赖动效源码，一处浏览。带npm的点进去调好参数再复制接入用法，带源码的直接 copy 单文件源码。

npm

拆字动画

文字动效

npm

模糊显影

文字动效

npm

数字滚动

文字动效

npm

磁吸

动效

npm

反光文字

文字动效

npm

渐变流光字

文字动效

npm

打字机

文字动效

npm

故障文字

文字动效

npm

解密文字

文字动效

npm

洗牌文字

文字动效

npm

逐词聚焦

文字动效

npm

掉落文字

文字动效

npm

点击火花

动效

npm

流星边框

动效

npm

悬停高光

动效

npm

电流边框

动效

npm

内容入场

动效

npm

淡入内容

动效

npm

磁吸线条

动效

npm

环形文字

文字动效

npm

噪点文字

文字动效

npm

乱码文字

文字动效

npm

光标拖尾

文字动效

npm

曲线跑马灯

文字动效

npm

轮换文字

文字动效

npm

动态网格

背景

npm

闪烁网格

背景

npm

交互网格

背景

npm

流星雨

背景

npm

字符矩阵

背景

npm

变形文字

文字动效

npm

渐显文字

文字动效

npm

手绘高亮

文字动效

npm

悬停按钮

动效

npm

连线光束

动效

npm

彩纸礼花

动效

npm

点击粒子

动效

npm

放大镜

动效

npm

光晕卡片

动效

npm

动画列表

组件

npm

磁吸 Dock

组件

npm

文件树

组件

npm

图标云

组件

npm

3D 地球

组件

npm

跑马灯

组件

npm

自定义光标

动效

npm

渐进模糊

背景

npm

彩虹按钮

动效

npm

涟漪

背景

npm

滚动跑马灯

文字动效

npm

流光边框

动效

npm

光泽按钮

动效

npm

闪烁文字

文字动效

npm

旋转文字

文字动效

npm

3D 翻转文字

文字动效

npm

文字入场

文字动效

npm

滚动揭示

文字动效

npm

视频文字

文字动效

npm

透视网格背景

背景

npm

压感文字

文字动效

源码

Roadmap Hero：深色 SaaS 增长首屏

组件

源码

Aura Cards：弥散渐变光晕卡片

组件

源码

Kivo：空间计算玻璃 UI

组件

源码

Aurora Carousel：聚焦放大的极光玻璃卡片

特效

源码

丝带卷边：边缘扭曲 + 彩虹折射

WebGL

源码

Flip：滚动翻牌的两种版本

Scroll

源码

ASCII 卡片：终端风格信息卡

组件

源码

Flow：从两侧汇流、居中放大

Scroll

源码

多米诺骨牌：逐张翻倒的卡片栈

Scroll

源码

滚动手风琴：逐张展开 + 线稿绘制

Scroll

npm

Liquid Metal：实时液态金属着色器

特效

npm

Border Beam：React 动态边框光效组件

组件

源码

Color Depth：十种材质的按钮

组件

源码

Dia Gradient：屏底彩虹辉光

特效

源码

Ghosty Reveal：雾化图片显影

特效

源码

Figma Vector Editor：选中框与矢量点

组件

源码

Midjourney ASCII：字符漩涡成标

特效

源码

Symbols Halftone：符号半调

特效

源码

The Typer：药丸打字机

特效

源码

Realistic Emboss：石膏压印

特效

源码

Chromatic Glow：色散辉光字

特效

源码

Ink Bleed：墨迹渗透

特效

源码

Angelic Grunge：霜蚀做旧

特效

源码

Stylized Pixelation：柔块像素化

特效

源码

Word Stickers：可甩飞的字贴纸

特效

源码

Tile Field：瓷砖网格字标

特效