秒表
简约拟物风格精准秒表组件（CSS+JS）这是一款基于 CSS + JS 实现的高精度秒表组件，采用拟物化设计风格，圆盘表盘配合进度弧线，质感细腻有层次。计时精度上用 performance.now() 替代普通 Date.now()，...
早安打工人
字母螺旋扩散动画效果（CSS+JS+SVG），早安崩溃的小浣熊动效这是一款基于 SVG + CSS + JS 实现的文字粒子扩散动画，代码实现了字母"A"沿螺旋轨迹向外飞散，大小渐变、间距疏密有序，配合尖叫浣熊的插画形象，把"早安崩溃"的打工人心态表现得活灵活...
固定导航栏
CSS 滚动感知吸顶导航 + 动态锚点指示器这是一款基于 CSS container-type: scroll-state + anchor-positioning + :target-current 实现的智能吸顶导航效果，无需 JS ...
翻页
仿真书页翻页效果（CSS+JS）这是一款基于 JS + CSS 实现的书籍翻页交互效果，模拟真实书本的页角卷曲与翻转过程，拖拽角落即可翻页，背面内容透视、折叠阴影细节都有还原，质感相当真实。这类效果最早流行于 Flash 时代...
手风琴卡片
纯 CSS 弹性手风琴卡片展开效果这是一款零JS依赖的弹性手风琴卡片组件，基于纯 CSS Flexbox 实现。如演示所示，未激活的卡片呈灰度收缩状态，悬停后平滑展开并还原全彩色，描述文字从底部上滑显示，视觉反差感强、过渡自然。...
实时壁纸
超写实雨滴玻璃动态壁纸生成器（WebGL+CSS）|支持日历+本地实时天气这是一款基于 WebGL + CSS Glassmorphism 技术实现的雨天玻璃模拟效果，雨滴的折射、流淌、聚合全部逼真还原，不是简单的动图，而是实时渲染的物理级视觉体验。背景支持自定义图片...
瀑布流布局
完全支持响应式的瀑布流布局效果，仅用 CSS 的 column-count 属性实现这是一款瀑布流图片排列效果，仅用 CSS 的 column-count 属性实现，无需任何 JavaScript 布局计算。图片按列自动填充，高低错落、排列自然，还内置了序号显示开关方便调试，并...
监控大屏
全球地震实时监控 HTML 可视化大屏这是一款实时地震动态气泡图效果，基于 D3.js + TopoJSON 技术实现，数据直连 USGS（美国地质调查局）官方 GeoJSON 接口，每5分钟自动刷新一次。气泡大小代表震级高低，颜色...
情人节爱心
2026情人节心形粒子动画：用物理模拟写一封情书这是一款情人节主题的动态粒子艺术效果，基于 Canvas + JS 矩阵运算库实现，用大量带旋转摆臂的圆形粒子单元动态组合成心形轮廓，每个粒子都在独立运动，整体却维持着心形的聚合态势，粒子时而聚...
人体运动动画
CSS火柴人行走动画：纯样式驱动的骨骼动画这是一款用纯 CSS 实现的火柴人行走循环动画，由多个圆角矩形拼接成人体骨骼结构，通过 CSS 关键帧动画驱动各关节旋转，模拟出自然的走路姿态，还支持行走、旋转两种模式切换，以及颜色和尺寸的实时调节。
切换过渡效果
多模式视图过渡切换效果：HTML 原生转场效果的新玩法这是一款基于 CSS View Transitions API 实现的图片切换效果，支持淡入淡出（Fade）、切片（Slice）、切片+骰子（Slice+Dice）三种过渡模式，可通过下拉菜单自...
标签切换
CSS 高级 Tabs 标签页组件：选项卡该有的样子！这是一款精致的 Tabs 标签页切换效果，基于 CSS + JavaScript 技术实现，当前激活项以青紫色渐变胶囊背景高亮显示，切换时内容区域平滑过渡，配合深色毛玻璃风格整体质感相当克制且高级。