Skip to content

Backgrounds & Patterns

Create animated backgrounds for your site with p5.js: waves, particles, noise and other generative patterns. Tweak colors, speed and density, and take the full code ready to paste.

How to use it

  1. Pick a pattern.
  2. Adjust colors, speed and density live.
  3. Copy the code and paste it into your site.

FAQ

What do I need to use it on my site?
Just p5.js: the exported code includes the CDN line to paste into your HTML.
Does it hurt performance?
It is a canvas animation: at moderate densities it runs smoothly even on phones.

More tools