creative-lab

Daily creative coding demos — canvas, WebGL, CSS, generative art.
One new demo every 2 days. Each is a single self-contained HTML file.

demos · 38 released
#001

Particle Gravity Field

200 particles attracted to dynamic gravity wells — mouse cursor + 2 fixed attractors. Trails fade with globalAlpha, color shifts from deep blue to white by speed.

Canvas 2D Physics Particles
Open →
#002

Fluid Particles

500 particles simulating fluid dynamics with simplified SPH. Mouse interaction disturbs the flow. Color gradients from deep blue through cyan to white by velocity.

Canvas 2D Fluid SPH
Open →
#003

SDF Raymarching

WebGL raymarcher with signed distance functions — rotating sphere and torus union, Phong shading, soft shadows, and smooth animation via time uniform.

WebGL GLSL Raymarching
Open →
#004

Fractal Explorer

Interactive Mandelbrot explorer in WebGL with drag-to-pan, wheel zoom, smooth coloring, adaptive iteration depth, and five switchable palettes.

WebGL GLSL Fractal
Open →
#005

Audio Visualizer

Microphone-driven audio canvas with live frequency bars, waveform overlay, bass beat detection, pulsing background, and automatic test-tone fallback.

Canvas 2D Audio Visualizer
Open →
#006

Interactive Voronoi

Animated Voronoi diagram built from half-plane clipping, with draggable seed points, click-to-add interaction, and optional Delaunay triangulation overlay.

Canvas 2D Voronoi Geometry
Open →
#007

Noise Terrain

Canvas isometric terrain with pure gradient noise, flowing offsets, elevation-based color bands from ocean blue to snow white, plus live speed and scale controls.

Canvas 2D Noise Terrain
Open →
#008

L-System Tree

Animated turtle renderer for classic L-system presets including tree, fern, Koch snowflake, and dragon curve, with adjustable iterations, angle, length, and draw speed.

Canvas 2D Fractal L-System
Open →
#009

Matrix Rain

Interactive digital rain of katakana and ASCII glyphs with glowing heads, fading trails, density and speed controls, palette switching, and click-driven disruption ripples.

Canvas 2D Generative Matrix
Open →
#010

Physics Bouncing Balls

Verlet-integrated pastel spheres with gravity tuning, elastic wall and ball collisions, live energy stats, and click-to-spawn interaction inside a dark canvas playground.

Canvas 2D Physics Verlet
Open →
#011

CSS 3D Card Flip Gallery

Six glassmorphism cards in a responsive 3D grid, each flipping on hover with a 0.6s rotateY transition, plus a global toggle that reveals every back face at once.

CSS 3D Gallery Glassmorphism
Open →
#012

Generative Typography

Canvas particles sampled from live text input, drifting off the letterform and springing back toward it while the cursor repels nearby points through a cyan-to-purple gradient.

Canvas 2D Typography Particles
Open →
#013

Game of Life

Interactive cellular automata playground with paint-to-seed input, rule presets, speed and grid controls, plus evolving cell age for color-rich emergence.

Canvas 2D Cellular Simulation
Open →
#014

Maze Generator

Animated recursive-backtracking maze builder with live cell-size and speed controls, then a pathfinding overlay that reveals the solved route.

Canvas 2D Maze Algorithm
Open →
#015

Water Ripple

Mouse-driven ripple field with adjustable disturbance strength, viscosity, and automatic pulses, rendered as a luminous fluid surface on canvas.

Canvas 2D Fluid Interaction
Open →
#016

Star Field

Depth-sorted warp tunnel of stars with parallax mouse drift, density and speed controls, and a burst mode that punches the scene into hyperspace.

Canvas 2D Space Parallax
Open →
#017

Neural Network

Animated feed-forward network visualizer with clickable inputs, adjustable hidden layers and neuron counts, and live activation propagation.

Canvas 2D Neural Net Visualizer
Open →
#018

Cloth Simulation

Verlet cloth sheet pinned across the top edge, with drag interaction, wind and gravity tuning, and optional tearing of overstressed constraints.

Canvas 2D Physics Verlet
Open →
#019

Artistic SVG Clock

Pure SVG clock with theme switching, smooth sweep hands, optional digital overlay, and multiple visual modes spanning spiral, particle, and geometry layouts.

SVG Clock Generative
Open →
#020

Smoke Simulation

Interactive smoke advection demo with brush, velocity, diffusion, and vorticity controls, letting the cursor inject drifting plumes into the field.

Canvas 2D Smoke Simulation
Open →
#021

Fourier Epicycles

Draw any contour and watch a ranked Fourier series rebuild it through spinning circles, with adjustable harmonic count, replay speed, and scaling.

Canvas 2D Math Fourier
Open →
#022

Reaction Diffusion

Gray-Scott reaction-diffusion field that grows live Turing patterns, with feed and kill controls plus direct painting of reagent B into the simulation.

Canvas 2D Chemistry Simulation
Open →
#023

Boids Flocking

Classic boids simulation with adjustable alignment, cohesion, and separation radii, plus pointer-based attraction or repulsion for live steering.

Canvas 2D Boids Simulation
Open →
#024

Lorenz Attractor

Projected 3D Lorenz attractor with rotating camera, glowing depth-based trails, and live chaos parameter controls for sigma, rho, beta, and speed.

Canvas 2D Chaos 3D Projection
Open →
#025

Spring Network

Elastic spring-mass mesh with draggable nodes, live stiffness and damping controls, and pulse disturbances that ripple through the structure.

Canvas 2D Physics Springs
Open →
#026

Brownian Motion

Random-walk particle cloud that deposits a luminous density heat map over time, with click-injected bursts and tunable jitter, drift, and decay.

Canvas 2D Particles Heat Map
Open →
#027

Bezier Curve Editor

Interactive quadratic and cubic Bezier playground with draggable control points, animated parameter traversal, and a live de Casteljau construction overlay.

Canvas 2D Bezier Geometry
Open →
#028

Sand Simulation

Falling-sand cellular automaton with sand, water, fire, stone, adjustable brush controls, and paintable material interactions in a dark sandbox.

Canvas 2D Cellular Sandbox
Open →
#029

Metaballs

Organic blobs merging and separating with implicit surface rendering, mouse attraction, customizable color palettes, and glowing edge effects via WebGL shaders.

WebGL Metaballs Organic
Open →
#030

Fireworks

Colorful particle fireworks with rocket trails, multi-burst explosions, gravity physics, inner sparkles, and click-to-launch or hold-for-rapid-fire interaction.

Canvas 2D Particles Physics
Open →
#031

Lightning Generator

Recursive midpoint-displacement lightning with dynamic branching, per-segment glow, crackling spark particles, ambient rain, and click-to-strike interaction.

Canvas 2D Procedural Glow
Open →
#032

Kaleidoscope

Real-time kaleidoscope with animated plasma generative source or live webcam input, adjustable segment count, rotation speed, zoom, hue shift, and drag-to-pan source.

Canvas 2D Kaleidoscope Webcam
Open →
#033

Pendulum Wave

15 pendulums of tuned lengths swing in and out of phase, creating rolling waves, counter-phase splits, and a mesmerizing re-sync every 60 seconds. Mouse click restarts; trail and pendulum count toggles included.

Canvas 2D Physics Phase Sync
Open →
#034

Double Pendulum

Chaotic double pendulum with RK4 integration, glowing speed-colored trails, multiple simultaneous pendulums showing sensitive dependence on initial conditions. Click to spawn more; drag the pivot.

Canvas 2D Chaos Physics
Open →
#035

Wave Interference

Interactive superposition demo with ripple sources, a classic double-slit experiment, and standing waves. Click to place sources; watch constructive and destructive interference build vivid patterns.

Canvas 2D Wave Physics Superposition
Open →
#036

Plasma Effect

Classic demoscene plasma rendered in WebGL with six overlapping sine waves, six swappable colour palettes, mouse-driven distortion, and live controls for speed, complexity, zoom, and hue cycling.

WebGL Demoscene Color Cycling
Open →
#037

Galaxy Spiral

Logarithmic-spiral galaxy with 12 000 stars across configurable arms, a glowing central bulge, dust cloud overlays, three colour palettes, differential rotation, and full 3D drag-to-tilt + scroll-to-zoom.

Canvas 2D Galaxy Rotation Curves
Open →
#038

Magnetic Field Lines

Dipoles, monopoles, and quadrupoles rendered with RK4-traced field lines and arrowheads, an optional vector-force grid, animated flow particles along field lines, and full drag-to-reposition pole interaction.

Canvas 2D Physics Vector Field
Open →
#039

Crystal Growth

Diffusion-Limited Aggregation simulation where random-walking particles stick to a growing crystal cluster. Four colour palettes map age from core to tip, stickiness and spawn-rate are tweakable, and click anywhere to plant extra seeds.

Canvas 2D DLA Generative
Open →