3D按钮
CSS 厚重 3D 立体按钮 UI 组件 多配色多规格前端按钮样式这是一款厚重饱满 3D 立体按钮效果，基于 CSS + JS技术实现，提供多套主流配色、全尺寸规格，适配图标按钮、通栏按钮、悬浮按钮等多种形态，相比普通扁平按钮，立体质感更突出，附带明显的按压效...
3D数字展厅
滚动驱动 3D 立方体旋转艺术展厅卡片轮播交互动效（CSS+JS）这是一款基于 CSS 3D+JavaScript 实现的滚动驱动 3D 立方体旋转艺术展示效果。它通过页面滚动触发立方体完成顺滑的 3D 旋转，六个展示面可承载不同艺术作品（图片或卡片）与配套内...
点阵过渡
SVG+GSAP 点阵缩放过渡（Loading）动画，圆点阵列空间动效这是一款点阵阵列丝滑缩放过渡动画效果，基于 SVG+GSAP 技术实现，通过圆点尺寸与阵列疏密的同步渐变，打造出带空间纵深感的 3D 流畅缩放动效，可适配多方向过渡需求，适用于品牌官网动效、页面...
桑基图
可交互全球咖啡供应链桑基地图 地球平面双模式数据可视化图表这是一款全球咖啡供应链流向可交互可视化图表，基于前端数据可视化技术实现，支持 3D 地球与平面地图双模式一键切换，搭配缩放、视图复位等便捷交互功能。图表以桑基流向形式，直观呈现全球咖啡主产区到...
加载库
24种CSS+SVG加载动画合集，开箱即用的Loading效果库这是一款加载动画集合效果，基于 CSS Keyframes + SVG + 少量原生 JS 技术实现，内置 24 种风格各异的 Loading 样式——涵盖旋转圆环、弹跳圆点、进度条、波纹、沙漏...
落叶飞舞
Canvas 粒子风吹飘落动效——可实时调参的树叶飞舞特效实现方案这是一款基于 JavaScript Canvas 实现的粒子流风吹漂浮动画效果。树叶在画面中随风飘动，每片叶子都有独立的运动轨迹，支持 2D 平面自旋和 3D 翻滚动画，配合湍流扰动，整体观感自...
弧形轮播
纯CSS 向内 3D 弯曲图片自动轮播组件 | 无需JS的沉浸式画廊组件这是一款纯CSS 3D环形自动轮播效果，仅用CSS实现，图片卡片沿弯曲弧形轨道排列，两侧自然透视收缩，中间聚焦突出，呈现出强烈的空间纵深感。难得的是全程不依赖JS驱动动画，代码量极少且注释详尽，...
手机演示
手机屏360度3D旋转演示动画，纯 CSS 实现手机隐私屏幕（防窥屏）模拟效果这是一款模拟三星 Galaxy S26 Ultra 隐私屏功能的交互效果，基于 CSS ::before 和 ::after 伪元素实现。核心玩法是：鼠标靠近手机时屏幕内容清晰可见，鼠标移开后视...
倾斜悬浮卡片
纯 CSS 实现 3D 倾斜卡片横向画廊这是一款基于纯 CSS 3D 变换实现的横向滚动卡片画廊。默认状态下所有卡片以统一的透视倾斜角度排列，像一排被推倒的多米诺牌，本身就已经很有空间纵深感。悬停时焦点卡片「站直」回正，虚线边框浮现，...
散落卡片
纯 CSS 实现 3D 名片飞散悬浮场景 + 灯箱预览这是一款纯 CSS 实现的 3D 悬浮名片展示效果。多张名片以随机角度散落在一个模拟木地板的三维空间中，带透视感的排列让整个场景有种「刚从桌上洒落」的真实质感。交互分三步走：初始状态名片自然飘散...
自定义下拉框
纯 CSS 文件夹堆叠3D扇形下拉选择效果这是一款文件夹堆叠下拉选择效果，基于纯CSS技术实现。通过重新设计原生的<select>选择器，将传统的下拉列表改造成了立体的文件夹堆叠形态。每个选项都以文件夹图标呈现，采用扇形排列，从上到下依...
流光
纯 CSS 全息故障文字动画效果+3D漂浮流光卡片这是一款全息故障文字动画效果，基于纯CSS技术实现。标题文字带有RGB色彩分离的故障艺术风格，字母边缘会闪现出青色和紫红色的重影，模拟老式电视信号干扰的视觉感。背景卡片则笼罩着一层流动的彩色光晕...