手绘下划线
纯 SVG + CSS 实现的 9 种不同风格手绘下划线悬停动画效果这是一款手绘下划线悬停动画效果，基于CSS动画+SVG Symbols+极简JavaScript技术实现。鼠标悬停导航文字时，会出现手绘风格的下划线，带有轻微的不规则感和动态描绘过程，每次显示还...
圆环加载器
纯 CSS 轻量级几何变形加载Loading动画效果这是一款几何变形加载动画效果，基于纯CSS技术实现。小圆点会在螺旋、圆环、花瓣等多种几何图案间流畅变换，每种形态都有独特的视觉韵律。整个动画通过flexbox居中布局，使用vmin单位让尺寸智能...
自定义下拉框
纯 CSS 文件夹堆叠3D扇形下拉选择效果这是一款文件夹堆叠下拉选择效果，基于纯CSS技术实现。通过重新设计原生的<select>选择器，将传统的下拉列表改造成了立体的文件夹堆叠形态。每个选项都以文件夹图标呈现，采用扇形排列，从上到下依...
流光
纯 CSS 全息故障文字动画效果+3D漂浮流光卡片这是一款全息故障文字动画效果，基于纯CSS技术实现。标题文字带有RGB色彩分离的故障艺术风格，字母边缘会闪现出青色和紫红色的重影，模拟老式电视信号干扰的视觉感。背景卡片则笼罩着一层流动的彩色光晕...
层级关系树
纯 CSS 评论回复锚点连接线布局效果这是一款评论回复锚点连接线效果，基于CSS Anchor Positioning技术实现。左侧的竖线能精准地将主帖与所有回复连接起来，无论回复内容有多长、有多少条，连接线都能自动延伸到合适的位置...
切角分割图库
纯 CSS 可展开式图片画廊切角效果这是一款可展开式图片画廊效果，基于CSS Grid和corner-shape:notch切角技术实现。默认状态下4张建筑图片均匀排列，当鼠标悬停某张图片时，它会立即展开占据更大空间，同时其他图片...
不规则卡片布局
CSS 不规则网格凹陷圆角卡片布局这是一款不规则网格凹陷圆角卡片效果，基于CSS Grid和高级圆角技术实现。卡片采用了反向圆角设计，在包裹按钮或其他元素时，边缘会向内凹陷形成优雅的弧线，而不是传统的外凸圆角。最巧妙的是卡片与内...
图片悬停
纯 CSS 图片悬停缩放圆角边框效果这是一款图片悬停缩放边框效果，基于CSS transform和transition技术实现。鼠标悬停时，图片会产生轻微的放大效果，同时边框样式也会发生变化，给人一种图片"呼吸"般的动态感受。适用...
过渡动画
CSS 镂空文本放大过渡到图片效果这是一款文字镂空图片遮罩放大过渡效果,基于CSS技术实现。大号的文字快速变成了"窗口",透过字母能看到下层的图片内容,就像把照片裁切成文字形状一样，转而文字消失，底层图片出现在页面中。这种从文字...
二进制时钟
three.js实现可拖拽的 3D 二进制时钟效果这是一款3D二进制时钟效果,基于Three.js+JavaScript技术实现。时间不是用常规数字显示,而是转换成二进制编码,通过亮起的青色方块来表示。整个时钟是个可以拖拽旋转的3D立体模型,放...
跳动加载
CSS上下跳动的开关切换加载 Loading 动画效果这是一款开关切换加载动画效果,基于CSS技术实现。视觉上是一个胶囊形状的开关图标,内部的圆形滑块会上下弹跳移动,模拟开关反复拨动的状态。用"开关"这个隐喻挺妙的,因为加载本身就是在等待系统"开启...
相册集
3D透视上下翻转卡片轮播效果，类似于相册集翻看效果这是一款翻转卡片画廊效果,基于CSS+JavaScript+HTML技术实现。卡片可以像翻书一样正反翻转,点击切换时会流畅地展示正反两面的不同图片内容。,通过左右箭头切换时会有翻转过渡动画,视觉...