故障风单选按钮
赛博故障风单选按钮（SVG滤镜+GSAP霓虹动效）这是一款赛博朋克故障风格的单选按钮组，基于 SVG 滤镜与 GSAP 动画实现。深色底上是一排霓虹绿的选项标签，鼠标悬停时背后的扫描线开始滚动并明暗闪烁，像老式显像管屏幕；选中某项时，粉色与青绿...
分数练习
分数切割数学 HTML5 小游戏（原生JS+SVG互动练习）这是一款考验分数直觉的切圆小游戏，基于原生 JavaScript + SVG 技术实现。屏幕给出目标分数（如 1/3、3/8），玩家转动切割线，凭手感在圆盘上切下对应的一块；落刀后圆盘会按分母自...
玻璃破碎效果
黑镜风格标题碎裂动画（CSS+SVG 玻璃破碎特效）这是一款黑镜风格的标题破碎开场动画，基于纯 CSS + SVG 技术实现。标题文字在黑色背景中缓缓放大、轻微抖动并逐渐虚化，营造出屏幕即将崩坏的紧张感；随后一声"脆响"般的瞬间，文字被裁切成三块...
3D卡片轮播
3D 分层视差卡片轮播 HTML 组件，支持滑动与键盘切换这是一款分层视差 3D 卡片轮播特效，基于 HTML + CSS 3D + 原生 JavaScript 与 SVG 渐变波浪实现，不依赖任何框架。每张卡片由背景层、边框层、内容层叠加而成：鼠标...
Logo开场动画
SVG Logo 动画特效 GSAP路径绘制+文字滑入演绎这是一款 SVG Logo 徽标动画，基于 SVG + GSAP（含 MotionPath 路径动画插件）技术实现，主题是「viewBox」这一 SVG 核心概念的可视化演示。动画一气呵成：先是...
脑图
GSAP 节点连线信息图（脑图）动画效果：SVG 路径描边+图标浮动这是一款信息图节点连线动效，基于 HTML+CSS+SVG+JavaScript（GSAP + ScrollTrigger）实现。画面结构很直白：中心一枚大脑图标作为核心，左右各三个圆形图标节点...
动态海浪背景
冲浪天气预报网页模板：SVG 动态海浪+潮汐图表+七天预报这是一款冲浪状况报告页效果，基于 HTML+CSS+SVG+JavaScript（GSAP ScrollTrigger）实现。首屏的海浪不是画好的图片，而是用多组正弦波叠加实时算出来的路径：振幅...
GSAP信息图
GSAP 信息图节点连线动画 - 数据落地页滚动可视化特效这是一款数据主题落地页的信息图连线效果，基于 HTML+CSS+JavaScript 与 GSAP 动画库实现。页面滚动时，分散的节点会沿路径依次点亮并连成线，把原本枯燥的数据关系变成一条能"跟...
3D爱心点赞
伪3D翻转爱心点赞按钮 | CSS3与SVG微交互UI动画这是一款伪3D立体翻转爱心点赞效果，基于 CSS3D + SVG + React技术实现。点击时爱心会沿着 Y 轴优雅旋转，同时伴随光晕与粒子散射的视觉反馈。这种轻量的微交互能给简单的点击赋予...
相片贴纸
基于SVG滤镜实现的手绘风线条贴纸相片装饰动画效果这是一款手绘风线条抖动（Boiling Effect）贴纸效果，基于 SVG 滤镜与 CSS 动画 技术实现。通过给图形边缘添加不规则的随机扰动，让静态的手绘 Emoji 和文字呈现出如经典定格...
故障导航菜单
基于GSAP的复古赛博朋克故障风（Glitch）导航菜单这是一款复古故障风导航菜单效果，基于CSS+GSAP动画库技术实现，通过高频随机的文本撕裂、横向位移错位以及色彩重叠动效，生动还原了早期电子屏幕的信号抖动感，能瞬间拉满页面的科幻与前卫属性，适用...
流体文字
基于SVG滤镜实现的流体文本融化字特效这是一款流体文本融化效果，基于CSS+SVG滤镜技术实现，它能让原本生硬的网页常规字体呈现出如同冰淇淋融化或粘稠流体般的趣味边缘质感，适用于潮流电商Banner、创意工作室官网、个性化主页以及需...