Home▸Optics & Light▸Moiré Pattern Generator (2D)

🌀 Moiré Pattern Generator (2D)

2D Canvas moiré pattern generator: overlay two line gratings or dot grids, adjust spacing and relative angle, and watch the real geometric moiré fringe pattern emerge with a live computed fringe spacing.

Optics & Light2DEasy60 FPS📱 Mobile-adapted⇄ 3D version
2d-moire-pattern ↗ Open standalone
⚙ Under the hood

Overlay two line gratings or dot grids in Canvas2D and adjust their spacing and relative angle to watch the real geometric moiré fringe pattern emerge. A live readout computes the predicted moiré fringe spacing using the classic beat-interference formula for two overlaid periodic patterns.

opticsinterferencemoirewave-physicsgeometry

2D · HTML5 Canvas 2D · 60 FPS target · runs fully client-side, no install

What did you find?

Add reproduction steps (optional)