Fine ink trails follow a broad direction field. Begin with 180 paths, a 240-pixel field scale, and gently aligned directions. Change one control at a time to see what it does.
Regenerate Reset
Density adds paths without moving the existing ones (100–1,400). Field scale sets the width of currents (48–260 px). Reset returns to the classroom defaults.
Your browser needs Canvas support to show this drawing.
Seed 1847 · 180 paths 1200 × 900 · Static drawing
Download PNG
Download HTML
Download recipe
Import recipe
Keep the HTML file to reopen this exact variation tomorrow or send the working piece to classmates. It runs offline. PNG saves the image. A recipe saves the settings for Import recipe.
Ready.
Method & people
This is an interpolated direction field: seeded directions vary within 0.9 radians of a shared current on a grid; smooth interpolation blends neighboring vectors. Paths advance in short steps and limit their turn at each step. Increasing field scale broadens the regions of similar direction; it does not change the canvas or pen width.
Recipe and reproduction details Algorithm: aligned-direction-field-v1. A 32-bit seeded random stream sets the field and starting points. Every path takes up to 160 steps of 2.6 pixels, ending at the drawing margin. Density sets the path count; field scale sets grid spacing. The fixed turn limit is 0.052 radians per step. Ink width is 0.95 canvas pixels. The shared direction is seeded within −0.3 to 0.3 radians; each grid vector varies by at most 0.9 radians from it.
This implementation uses interpolated random vectors, not Perlin noise, curl noise, or a fluid solver. The version 1 recipe stores the seed, both adjustable parameters, the fixed canvas, and frame: null for this static drawing. Reproduction is deterministic within the same browser; Canvas antialiasing can differ across browsers. Imports must match this version and canvas and be at most 16 KB.
Credits and a class exercise
Tyler Hobbs, Flow Fields (2020) explains tracing curves through direction grids and varying their behavior. Credit him here as an artist and explainer of this approach. This adaptation does not reproduce a specific work of his. Source checked September 28, 2026.
Code adapted from The Vibes Are People’s offline starter , with AI assistance from OpenAI Codex. Tools: JavaScript and the browser’s Canvas 2D API; no outside libraries or model calls. The classroom prompt supplies the intended feeling of calm.
Try this next: keep seed 1847 and density 180, compare scale 80 with 240, and describe the change in the width of the currents.