发送按钮动画
发送按钮液体熔融动画过渡效果(CSS+JS+SVG)这是一款带有 Goo 液态熔融效果的发送按钮交互动效,基于 CSS+JavaScript+SVG 技术实现,点击纸飞机发送按钮触发丝滑的粘连形变过渡动画,自然完成从发送状态到成功状态的切换,动画...
GSAP 异步加载动画
GSAP+SVG 实现丝滑异步加载器,电商下单与删除按钮状态动画这是一款基于 HTML+CSS+JavaScript+GSAP+SVG 技术实现的高品质异步加载器效果,专为电商按钮交互设计,提供购买成功和删除失败两套完整的状态动画流程。无论异步操作时长如何变...
加载条
纯 CSS 自动对比度 Loading 加载进度条动效这是一款基于纯 CSS 实现的自动对比度加载进度条效果。进度填充与文字显示同步联动,通过自动对比度适配让加载状态视觉清晰、层级分明,极简风格适配性强,适用于网页加载、数据提交、资源缓冲等各类等待...
点阵过渡
SVG+GSAP 点阵缩放过渡(Loading)动画,圆点阵列空间动效这是一款点阵阵列丝滑缩放过渡动画效果,基于 SVG+GSAP 技术实现,通过圆点尺寸与阵列疏密的同步渐变,打造出带空间纵深感的 3D 流畅缩放动效,可适配多方向过渡需求,适用于品牌官网动效、页面...
加载库
24种CSS+SVG加载动画合集,开箱即用的Loading效果库这是一款加载动画集合效果,基于 CSS Keyframes + SVG + 少量原生 JS 技术实现,内置 24 种风格各异的 Loading 样式——涵盖旋转圆环、弹跳圆点、进度条、波纹、沙漏...
发光球加载器
两个发光球体运动加载动画 | 高质感CSS Loader特效组件这是一款光球残影小球旋转加载动画效果,基于 CSS 技术实现。两个发光圆球在黑色背景上围绕圆圈互相追逐游走,运动过程中拖出一串半透明残影,模拟出真实的物理运动感,就像长曝光拍到的光源轨迹。三种配...
混合色块加载器
纯 CSS 实现的创意色彩混合动态加载Loading动画这是一款基于 CSS color-mix() 函数实现的加载动画效果。几个半透明圆角色块在一个倾斜的容器内持续位移,重叠区域的颜色会随着色块运动实时混合计算,每一帧的交叠色都是真实的颜色混合结果...
相机光圈
呼吸快门,用 p5.js 模拟镜头光圈的律动感,适合于网站 Loading 动画等场景这是一款「呼吸快门」动态视觉效果,基于 p5.js 技术实现。灵感来自相机光圈的开合机制——叶片在收缩与展开之间循环,赋予画面一种均匀呼吸的节奏感。闭合时线条向中心聚拢成放射状,舒展时线条随旋转...
圆环加载器
纯 CSS 轻量级几何变形加载Loading动画效果这是一款几何变形加载动画效果,基于纯CSS技术实现。小圆点会在螺旋、圆环、花瓣等多种几何图案间流畅变换,每种形态都有独特的视觉韵律。整个动画通过flexbox居中布局,使用vmin单位让尺寸智能...
跳动加载
CSS上下跳动的开关切换加载 Loading 动画效果这是一款开关切换加载动画效果,基于CSS技术实现。视觉上是一个胶囊形状的开关图标,内部的圆形滑块会上下弹跳移动,模拟开关反复拨动的状态。用"开关"这个隐喻挺妙的,因为加载本身就是在等待系统"开启...
蠕动加载器
纯 CSS 圆球贪吃蛇蠕动加载动画效果这是一款蛇形加载动画效果,基于纯CSS技术实现。一串橙色圆球排成S形曲线,像贪吃蛇在屏幕上扭动身体。每个圆球的大小有微妙变化,越靠近"蛇头"越大,越往"蛇尾"越小,营造出透视纵深感。整条蛇会循...
丝滑切图
基于 GSAP 打造的高端丝滑多图入场+转场加载动画效果这是一款高精度的丝滑加载转场效果,基于 GSAP 动画库与 CSS 现代布局技术实现。无论是图片的初次亮相还是切换交互都非常的亮眼!它通过对每一帧动画的精确控制,实现了如流体般顺滑的元素重组与入...