Shader 8 - Interactive Grid Shader

Pro

A full-screen shader background with ping-pong buffer, grid-based shapes (squares, crosses, lines), and mouse interaction.
Shadcn Shader 8 block

Component Data

  • ID:shader8
  • Access:pro
  • Created:Dec 17, 2025
  • Type:block

Shader 8 block design & features

Shader8 is a full-screen shader background built with shadcn/ui and React Three Fiber, using a ping-pong buffer for state. The buffer shader updates grid cells based on mouse position. The display shader renders shapes (squares, crosses, lines) from the cell state. Mouse interaction drives the pattern. Pointer leave resets the mouse uniform.

Grid-based with discrete shapes. The pattern reads as a cellular automaton or game-of-life style grid. Mouse creates trails. Continuous animation.

Interactive and game-like. The ping-pong grid with shape rendering is distinctive. Elaborate with FBO and mouse interaction.