弧形轮播
纯CSS 向内 3D 弯曲图片自动轮播组件 | 无需JS的沉浸式画廊组件这是一款纯CSS 3D环形自动轮播效果，仅用CSS实现，图片卡片沿弯曲弧形轨道排列，两侧自然透视收缩，中间聚焦突出，呈现出强烈的空间纵深感。难得的是全程不依赖JS驱动动画，代码量极少且注释详尽，...
个性时钟
原生 CSS+JS 实现的竖排时钟特效 | 多风格可切换的创意数字时钟组件这是一款竖排数字时钟效果，基于 CSS + JS 技术实现。时钟将每一位数字纵向排列成列状，整体呈"十字交叉"布局展示当前时间，视觉上颇具设计感。亮点在于内置多套风格皮肤——齿轮时钟、卡片时钟、...
爱情告白
Canvas 情话表白多幕交互页面，情人告白网页专用！这是一款基于 CSS + Canvas 实现的浪漫告白互动效果。深红色背景上漂浮着大量粒子爱心，中央毛玻璃卡片承载着逐幕展开的情书内容，顶部还有一条进度条记录故事推进到哪一步——整体走的是奢华红...
疯狂头像
个性化头像显示 CSS 组件，让头像冲出边框！这是一款基于 CSS 实现的个性化头像组件效果。每个头像以圆形裁切展示，背后衬有黄色波点底盘作为装饰背景，搭配橙红色整体底色，视觉冲击力很强，有种复古波普艺术的味道。头像与波点底盘之间有白色描边...
滚动联动画廊
纯 CSS 实现滚动联动导航图库预览效果这是一款基于纯 CSS 实现的图片画廊导航效果，综合运用了 :target-before、:target-current、:target-after 伪选择器、CSS 锚点定位（Anchor P...
混合色块加载器
纯 CSS 实现的创意色彩混合动态加载Loading动画这是一款基于 CSS color-mix() 函数实现的加载动画效果。几个半透明圆角色块在一个倾斜的容器内持续位移，重叠区域的颜色会随着色块运动实时混合计算，每一帧的交叠色都是真实的颜色混合结果...
手机演示
手机屏360度3D旋转演示动画，纯 CSS 实现手机隐私屏幕（防窥屏）模拟效果这是一款模拟三星 Galaxy S26 Ultra 隐私屏功能的交互效果，基于 CSS ::before 和 ::after 伪元素实现。核心玩法是：鼠标靠近手机时屏幕内容清晰可见，鼠标移开后视...
音乐播放器
波浪线媒体（音乐）播放卡片（CSS+JS）这是一款仿 Google 风格的音乐播放卡片效果，基于 CSS + JS 技术实现。进度条被替换成一段动感的波浪曲线，视觉上比普通直线更有活力，整张卡片以专辑封面作为背景，叠加毛玻璃质感的控制区...
倾斜悬浮卡片
纯 CSS 实现 3D 倾斜卡片横向画廊这是一款基于纯 CSS 3D 变换实现的横向滚动卡片画廊。默认状态下所有卡片以统一的透视倾斜角度排列，像一排被推倒的多米诺牌，本身就已经很有空间纵深感。悬停时焦点卡片「站直」回正，虚线边框浮现，...
描边卡片
个性波浪动态描边流光卡片，CSS + SVG 动态扭曲边框效果这是一款基于 CSS + SVG 实现的动态边框卡片效果。每张卡片的边框不是普通的直线，而是持续蠕动的波浪曲线，配合外侧的彩色光晕扩散，整体像是卡片在「呼吸发光」。三种配色方案（青色、橙色、紫...
动态粒子背景
Canvas 彩色磁力粒子星空背景，鼠标驱动的动态粒子交互系统这是一款基于原生 JavaScript 实现的动态粒子特效。满屏漂浮的彩色粒子会被鼠标持续「吸引」，靠近时自动环绕旋转，粒子之间以及与鼠标之间用色相渐变的连线实时相连，整体呈现出星座图谱般的视觉...
横向图库
纯 CSS 实现的支持横向拖拽切换图片的响应式高端画廊这是一款基于 CSS 实现的横向图片画廊，支持左右滑动切换照片，最有意思的设计在于把滚动条本身当作分页进度条来用——底部那条绿色细线不是装饰，而是实时反映当前浏览位置的滚动指示器，一举两得。画廊...