Dither Flow Shader

Customize:

• 2 to 4 color stops

• Noise scale, warp and contrast

• Animation speed, or a still frame

• Dither cell (pixel) size, tonal levels and dither amount

• Animated grain

• Cursor mode: Off, Warp, Glow, or Warp + Glow, with power and size

• Pause when off-screen, reduced-motion support, max DPR cap

Use it for

• Landing page hero backgrounds

• Retro or editorial banners and cards

• Animated backdrops for app mockups

Additional details

• Rendering — Real WebGL fragment shader (Bayer 8x8 dither)

• Cursor modes — Off, Warp, Glow, or Warp + Glow

• Colors — 2 to 4 gradient stops

• Performance — Pauses off-screen, DPR cap, static fallback

• Accessibility — Optional reduced-motion still frame