手机演示
手机屏360度3D旋转演示动画，纯 CSS 实现手机隐私屏幕（防窥屏）模拟效果这是一款模拟三星 Galaxy S26 Ultra 隐私屏功能的交互效果，基于 CSS ::before 和 ::after 伪元素实现。核心玩法是：鼠标靠近手机时屏幕内容清晰可见，鼠标移开后视...
描边卡片
个性波浪动态描边流光卡片，CSS + SVG 动态扭曲边框效果这是一款基于 CSS + SVG 实现的动态边框卡片效果。每张卡片的边框不是普通的直线，而是持续蠕动的波浪曲线，配合外侧的彩色光晕扩散，整体像是卡片在「呼吸发光」。三种配色方案（青色、橙色、紫...
横向图库
纯 CSS 实现的支持横向拖拽切换图片的响应式高端画廊这是一款基于 CSS 实现的横向图片画廊，支持左右滑动切换照片，最有意思的设计在于把滚动条本身当作分页进度条来用——底部那条绿色细线不是装饰，而是实时反映当前浏览位置的滚动指示器，一举两得。画廊...
散落卡片
纯 CSS 实现 3D 名片飞散悬浮场景 + 灯箱预览这是一款纯 CSS 实现的 3D 悬浮名片展示效果。多张名片以随机角度散落在一个模拟木地板的三维空间中，带透视感的排列让整个场景有种「刚从桌上洒落」的真实质感。交互分三步走：初始状态名片自然飘散...
贷灵石
外汇交易券商金融投资 HTML 网站模板 | 加密货币股票理财服务响应式建站模板这是一款专为外汇经纪商、金融投资平台、加密货币服务商、货币承兑及股票交易机构量身打造的 HTML 响应式网站模板，提供 2 套多页版首页风格方案，共 15 个以上完整页面，覆盖外汇交易服务展示、...
过年歌轮播
滚动居中放大预览卡片，CSS 原生滚动驱动卡片轮播动画这是一款基于 CSS animation-timeline: scroll() 实现的滚动缩放效果。页面初始呈现一排等大的深色卡片，随着用户向下滚动，位于中心的卡片会逐渐放大并高亮为蓝色，两侧卡...
相机光圈
呼吸快门，用 p5.js 模拟镜头光圈的律动感，适合于网站 Loading 动画等场景这是一款「呼吸快门」动态视觉效果，基于 p5.js 技术实现。灵感来自相机光圈的开合机制——叶片在收缩与展开之间循环，赋予画面一种均匀呼吸的节奏感。闭合时线条向中心聚拢成放射状，舒展时线条随旋转...
商品展示
纯 CSS 暖调极简商品卡片布局 + 日夜模式主题切换效果这是一款纯 CSS 实现的商品展示卡片，左图右文的经典布局，暖米色配金棕色调，整体气质克制而高级，并且支持响应式布局，在移动端等小型设备中也能通过上下布局的形式完美展示。最亮眼的是图片区域下方内...
WhatsApp UI
WhatsApp 风格聊天界面 UI 布局动效这是一款基于 GSAP + Three.js 实现的仿 WhatsApp 桌面端 HTML 布局界面，三栏布局还原度极高，聊天、状态、通话一览无余。最出彩的是背景——用 Three.js 着色器...
固定导航栏
CSS 滚动感知吸顶导航 + 动态锚点指示器这是一款基于 CSS container-type: scroll-state + anchor-positioning + :target-current 实现的智能吸顶导航效果，无需 JS ...
翻页
仿真书页翻页效果（CSS+JS）这是一款基于 JS + CSS 实现的书籍翻页交互效果，模拟真实书本的页角卷曲与翻转过程，拖拽角落即可翻页，背面内容透视、折叠阴影细节都有还原，质感相当真实。这类效果最早流行于 Flash 时代...
艾尼斯
创意代理机构作品集 HTML5 响应式网站模板 | 多风格首页数字营销品牌建站模板这是一款面向创意机构、品牌设计、数字营销及个人作品集展示的 HTML5 响应式网站模板，提供 6 套风格各异的首页方案，涵盖创意代理、作品集、商城、瀑布流图集、全屏滑动、横向展示等多种形式，整体...