aher.dev

Lab

Flow Matching Lab

Flow matching is the generative technique behind current frontier image models. This page trains one from scratch, live, in your browser: a neural network learns a velocity field that carries Gaussian noise onto a target shape. Pick a preset or draw your own distribution and watch it learn in seconds.

← Back to projects

Training telemetry

Optimizer steps
0
Loss (EMA)

Gray dots are samples from the target distribution. Blue particles start as Gaussian noise and follow the learned velocity field v(x, t) for 64 Euler steps; as the loss falls, they land on the target. Switching shapes resets the model, so you watch it learn from scratch every time.

How it works

The objective

Rectified flow matching: sample noise x₀, data x₁, and a time t, form the interpolation xₜ = (1−t)x₀ + t·x₁, and regress the network v(xₜ, t) onto the straight-line velocity x₁ − x₀ with plain mean squared error. No adversarial training and no ELBO, just regression.

The model

A 3-hidden-layer tanh MLP (48 units each) over (x, y) plus a sinusoidal time embedding. The forward pass, backpropagation, and Adam optimizer are hand-written in TypeScript, with no TensorFlow, no ONNX, and no downloads. Training runs on a 5 ms per-frame budget so the page stays smooth.

Sampling

Generation integrates the learned ODE dx/dt = v(x, t) from t = 0 to t = 1 with Euler steps, one step per animation frame. The same idea, scaled to millions of dimensions and transformer-sized networks, is how state-of-the-art image and audio generators work.