多变液态气泡
WebGL 3D 液态玻璃超大泡泡交互变形效果,点击变换多种形态附着与页面!这是一款 3D 液态玻璃交互效果,基于 WebGL 技术(VFX-JS)实现,精准还原玻璃的透明质感、彩虹色散与高光反射效果,点击泡泡可触发自然流畅的 3D 液态变形动画,视觉表现力极强。适用于...
解压球
GSAP趣味减压球交互效果,模拟真实的重力、弹力以及变形物理反馈这是一款基于GSAP动画库实现的“减压球”交互效果,通过拖拽和释放动作触发球体的旋转与弹跳,模拟真实重力与弹力物理反馈,仿佛真实的球类运动。用户可自由选择“压力球”或“网球”模式,体验流畅、富有...
圆角变形卡片
CSS悬停卡片及图片反转圆角变形效果这是一款动态形状变换效果,基于CSS clip-path 和过渡动画实现,元素默认带有内凹圆角,悬停时平滑切换为外凸圆角或扭曲变形,适用于创意按钮、卡片或交互式视觉元素。
波浪文字
CSS悬停波浪文字动画效果这是一款基于 font-variation-settings 和 CSS 动画实现的文字悬停波浪变形效果,通过调节字重宽度参数模拟波动,适用于标题动态展示或数据可视化场景。
星变心
SVG+JS实现小星星跳一跳变为小心心动画效果这是一款形状变形效果,基于SVG技术实现,它展示了如何将满屏的小星星摇身一跳变为了满屏的小心心。通过将形状分解成多个立方贝塞尔曲线段(在心形或星形的情况下使用5段),然后在这两种形状的关键坐标之...
图形变换
仅HTML单个DIV元素实现的圆形方形循环变幻效果这是一款循环变形效果,基于CSS技术实现,一个元素通过阴影的巧妙运用看起来像是从圆形平滑过渡到方形再变回圆形,常见变化都在单个HTML元素上完成,利用CSS动画属性实现流畅转变。

