↗
01 · 忠实还原
多窗口同步 3D
把页面开成多个浏览器窗口,拖到屏幕不同位置,立方体会跨窗口同步位置。原作源码忠实移植。
★ 18.9klocalStorage 同步
↗
02 · 同款复刻
实时光线步进
Fragment shader 里逐像素做 ray marching:距离场、软阴影、环境光遮蔽、反射。可调反射强度与转速。
★ 2.2kGLSL Shader
↗
03 · 同款复刻
3D 地球 · 飞线
程序化点阵地球 + 大气辉光 + 城市节点 + 弧形飞线动画。拖拽旋转、滚轮缩放,无需任何外部贴图。
★ 2.1k数据可视化
↗
04 · 同款复刻
粒子网络背景
三维粒子 + 近邻连线 + 鼠标吸引的动态背景层,可直接铺在任意网页内容下方。
★ 6.6k网页背景
↗
05 · 同款复刻
银河星系生成器
十万粒子构成的螺旋星系,按半径从内核暖橙渐变到外缘冷蓝。旋臂数、缠绕、离散度均可调。
★ Journey粒子系统
↗
06 · 经典效果
超空间隧道穿梭
数千颗星沿管道向你飞来,按住鼠标曲速加速,FOV 拉伸 + 镜头滚转强化冲刺感。
★ Warp星空粒子
致敬经典 Star Field / Hyperspace
↗
07 · 同款复刻
Synthwave 无限地形
vertex shader 用 fBm 噪声实时抬升网格,UV 随时间平移 → 永远向前飞的蒸汽波线框山脉 + 落日。
★ Retrowave噪声地貌
致敬经典 Retrowave Terrain
↗
08 · 同款复刻
Mandelbulb 分形
全屏 fragment shader 做 ray marching,每像素迭代 8 次幂距离场,渲染出会呼吸变色的"3D 曼德博集"。
★ Fractal距离场
致敬 raymarched fractals / ShaderToy
↗
09 · 同款复刻
鼠标流体模拟
GPU 上多张浮点纹理 ping-pong 求解 Navier-Stokes:平流、散度、压力雅可比迭代。拖动鼠标喷染料。
★ 16.4k流体仿真
↗
10 · 同款复刻
粒子变形
6.5 万粒子在球 / 立方 / 环面 / 星系 / 波面之间平滑 morph,缓动插值奔向新目标,可点选或自动轮播。
★ Morph形变插值
致敬 MisterPrada/morph-particles
↗
11 · 同款复刻
鸟群 Boids
数百只鸟仅靠分离 / 对齐 / 聚合三条本地规则,涌现出整体群飞。InstancedMesh 渲染,移动鼠标可驱散。
★ 官方集群智能
致敬 three.js 官方 GPGPU birds
↗
12 · 同款复刻
Bloom 霓虹辉光
EffectComposer 后处理管线 + UnrealBloomPass:提取高亮、多级模糊再叠加,自发光体散出霓虹光晕。强度可调。
★ 2.8k后处理
↗
13 · 同款复刻
Glitch 故障风
先渲染场景到纹理,再用全屏 shader 做 RGB 通道分离 + 块状位移 + 扫描线 + 噪点,间歇触发强故障。
★ 1.1k后处理
↗
14 · 同款复刻
音频可视化
Web Audio AnalyserNode 做 FFT,把频谱映射到环形 3D 柱 + 脉动球 + 粒子。支持麦克风 / 拖入音频 / 内置 Demo 音。
★ Audio声音驱动
致敬 audio-visualizer-three-js
↗
15 · 同款复刻
万花筒
全屏 shader 把画面转极坐标、对角度取模镜像折叠,叠加流动噪声纹理 → 不断变幻的对称花纹。镜面数可调。
★ Shader极坐标镜像
致敬经典 Kaleidoscope Shader
↗
16 · 同款复刻
DNA 双螺旋
两条反向缠绕的磷酸骨架 + 碱基对横档,全用 InstancedMesh 一次绘制调用渲染上千个球与连杆。转速 / 螺距可调。
★ Instancing生物可视化
致敬 instancing 经典范式