IOS风格UI
纯CSS打造的 iOS 26 液态玻璃 U效果，轻盈通透，质感拉满!这是一款iOS 26 液态玻璃风格 UI效果，基于 CSS 技术实现，它通过backdrop-filter和blur等现代CSS特性，实现了无需JavaScript的高级视觉层次感，画面中，一个...
图片细节查看器
基于 JS+CSS 的鼠标揭示图像交互效果，在模糊的整体照片中呈现圆形的清晰区域这是一款鼠标揭示图像效果，也叫：图片细节查看器，基于 JS+CSS 技术实现，通过鼠标移动或点击，在模糊的整体图像中呈现圆形的清晰区域，让用户主动探索图像内容。适用于创意图片展示、交互型网页设计...
俏皮文字
基于 GSAP+SVG 的趣味文字悬停“弹性跳动”动画效果，风格俏皮活泼这是一款趣味 SVG 悬停动画效果，基于 CSS+GSAP+SVG 技术实现，鼠标悬停时标题文字与下方曲线会呈现“弹性跳动”地灵动的动态变化，风格俏皮活泼。整体风格简洁可爱，色彩柔和，充满趣味性...
贪吃蛇
用Webflow和GSAP打造的8位像素贪吃蛇 HTML 小游戏：交互与动画的完美融合这是一款基于Webflow与GSAP（GreenSock Animation Platform）实现的复古8位风格贪吃蛇游戏，融入gsap/physics2D物理特性，通过物理引擎和流畅动画还原...
消息提醒
基于 CSS 的液态玻璃质感通知栏卡片这是一款液态玻璃风格的通知栏卡片效果，支持响应式布局，基于纯 CSS 技术实现，通过半透明渐变与柔和光影模拟出类似流动玻璃的视觉质感。每条通知都带有轻微的毛玻璃模糊效果，首条消息还带有轻微的中心...
手风琴
纯CSS轻量级响应式手风琴：原生标签搞定折叠菜单，FAQ页面首选！这是一款纯CSS实现的响应式手风琴面板，基于HTML5原生<details>和<summary>标签，无需任何JavaScript即可实现内容折叠交互。每个面板独立开关，设计清爽无负担，适配手机...
粒子文字
基于 GSAP+three.js 实现的粒子变形球体交互 3D 文字动画效果这是一款基于Three.js+GSAP实现的交互式3D粒子球文字动画，通过成千上万的微小粒子构成一个动态的球体。当用户输入文字并点击“Create”按钮后，粒子球会瞬间解构重组，将原本的球形结构...
票根
基于 CSS 的机票票根形状 UI 效果这是一款用纯CSS实现的机票票根样式设计，通过巧妙运用clip-path和border-radius等技术，精准还原机票的圆角、撕边等细节，还原了真实登机牌的视觉形态。票面信息清晰，包含航班号、...
玻璃按钮
液态玻璃风格主题模式切换透明按钮，用CSS打造地会“流动”的交互按钮这是一款液态玻璃风格开关切换效果，基于 CSS 技术实现，通过渐变、阴影与透明度的巧妙结合，以玻璃透明质感的视觉表现和顺滑的切换动画，实现日 / 夜模式等场景的交互控制，不仅功能清晰，还极具现...
播放暂停按钮
基于 SVG 的播放 / 暂停按钮描边动画效果这是一款基于SVG的媒体控制播放/暂停按钮描边动画效果，通过巧妙控制线条的绘制长度与动画时机，实现流畅的视觉过渡效果。点击时，圆形边框由“播放”图标动态变为“暂停”状态，线条逐步填充形成双竖线...
404页面
超有趣的卡通风格 404 HTML页面 NotFound 效果，仅用CSS实现！这是一款创意十足地趣味卡通 404 页面效果，基于 CSS 技术实现，通过卡通风格的原始人形象与幽默文案，将“页面未找到”的尴尬转化为轻松有趣的体验。画面中，原始人手持把玩断裂的电线，象征连接中...
缺口圆角
基于 CSS 的分段圆角角形效果，仅使用一个div，30行代码实现！这是一款基于 CSS 实现的分段圆角、四边角效果，通过对圆角边框进行分段设计，通过巧妙运用边框与伪元素，打造出具有科技感的“缺口圆角”视觉样式，整体呈现出一种未来感十足的几何轮廓，该效果无需额外...