索引
全部 40 件标本。用展厅、用法、感觉和标签交叉筛选，也可以直接搜。
标签
Stagger
一组元素不是同时出现，而是按顺序一个接一个进来。
错峰动画 / 依次出现
Easing
决定动画快慢怎么分配：起步快还是收尾慢，全在这条曲线上。
缓动函数 / 时间曲线
Spring Physics
元素像挂了弹簧一样冲向目标：可能冲过头，再弹回来停住。
弹性动画 / 回弹
Scroll Reveal
内容滚进视口时才淡入上移，没滚到的先藏着。
滚动出现 / 滚动淡入
Parallax
滚动时前景和后景走不同速度，画面因此有了纵深。
视差 / 层叠滚动
Scroll-Driven Animation
滚动条就是进度条：滚到哪一帧由滚动位置决定。
滚动时间线 / 滚动进度动画
View Transitions
页面切换时，浏览器把新旧两屏接起来，补出中间那一下过渡。
页面转场 / 跨页面过渡
Cursor Follower
一个圆点慢半拍地跟在指针后面，把系统鼠标指针换掉。
跟随鼠标 / 指针跟随
Hover Lift
指针移到卡片上，它轻轻上浮、阴影变大，暗示这块可以点。
悬停浮起 / 鼠标移上去抬起来
Press Feedback
手指按下的瞬间按钮缩小、变暗，松开立刻弹回，确认这一下点到了。
按下缩放 / 点击回弹
Magnetic Button
指针靠近时按钮被吸过去一点点，移开又弹回原位。
磁力按钮 / 跟随鼠标的按钮
Skeleton Shimmer
灰色占位块上有一道亮光反复扫过，表示内容还在加载。
骨架屏 / 微光扫过
Optimistic UI
点下去界面立刻变成成功的样子，请求在后台跑，失败了再退回去。
乐观更新 / 先改后存
Toast
一条短消息从屏幕边缘滑进来，几秒后自己消失，不打断当前操作。
轻提示 / 消息提示条
Ripple
点下去的地方荡开一圈水波，告诉用户这一下收到了。
水波纹 / 点击涟漪
Command Palette
按一个快捷键弹出一个搜索框，敲几个字就能跳到任何功能。
命令面板 / 快捷搜索框
Sticky Header
页面滚动时头部留在顶部，常配合「下滑隐藏、上滑出现」。
吸顶导航 / 固定顶栏
Sticky Stacking Cards
滚动时后面的卡片一张张压上来，前一张缩小留在底下。
卡片堆叠 / 叠卡片
Masonry
卡片高度不齐，自动落进最短的那一列，底部不留大洞。
瀑布流布局 / 瀑布流排版
Bento Grid
大小不一的方块拼成一整块，边线对齐，主次一眼分得清。
便当盒布局 / 便当网格
Scroll Snap
滚动停下来时自动对齐到某一张卡片，不会卡在半路上。
滚动吸附 / 滑动吸附
Accordion
点标题展开内容，同一组里通常只开一个，标题一直在。
手风琴 / 展开收起
Virtual Scrolling
列表只渲染看得见的那几行，一万条也能滚得顺。
虚拟列表 / 长列表优化
Marquee
一排内容不停地横向滑过，首尾相接，看不出接缝。
无缝滚动 / 横向滚动条
Frosted Glass
面板背后的内容被真的模糊掉，像隔着一层磨砂玻璃看过去。
磨砂玻璃 / 磨砂
Glassmorphism
半透明面板 + 亮边 + 柔影叠在彩色背景上，像一块玻璃浮在画面里。
玻璃态 / 玻璃质感
Mesh Gradient
多个径向渐变叠在一起，颜色朝任意方向过渡，没有一条直线的渐变轴。
网格渐变 / 弥散渐变
Grain Noise
在画面上撒一层随机像素，给纯色和渐变加质感，顺手压掉色带。
噪点 / 颗粒感
Spotlight Glow
一块柔光跟着指针在卡片表面移动，像有人拿手电照上去。
聚光灯 / 鼠标光晕
Gradient Border
描边不是一种颜色，而是一条渐变沿着元素轮廓走一圈。
渐变边框 / 彩色描边
Aurora Gradient
几团彩色光斑在底色上慢慢游动，像极光一样铺满整屏。
极光背景 / 流动渐变
Mask Fade
内容在边缘渐渐淡掉，暗示这一头还能继续滑。
渐隐遮罩 / 边缘淡出
Fluid Type
字号随容器宽度连续变化，不会在断点上突然跳一档。
流式字号 / 自适应字号
Text Balance
多行标题的每行长度被拉齐，最后一行不再只剩一个孤字。
平衡换行 / 折行平衡
Gradient Text
把文字当成蒙版，露出来的不是单色而是背后的渐变。
渐变字体 / 文字渐变
Character Reveal
标题里的字一个接一个落到位，像被逐字写出来。
逐字动画 / 字符入场
Variable Font
一个字体文件里带着连续的字重轴，可以停在任意粗细。
可变字重 / 轴字体
Count Up
数字从 0 快速滚到目标值，然后停住。
数字递增 / 数值动画
Text Stroke
文字只留一圈轮廓、里面是空的，大标题一下就硬起来了。
空心字 / 描边字
Tabular Numbers
让每个数字占一样宽，数值变化时整行不会左右抖。
等宽数字 / 数字不跳