Shadcn UI Shader Block
Shader6 is a full-screen shader background built with shadcn/ui and React Three Fiber, rendering a procedural wave pattern with cosine-based color. The shader applies a 4x4 Bayer dither to convert the color output to black and white, then maps the result to configurable foreground and background colors. A color prop controls the foreground (default orange), and a backgroundColor prop controls the background (default black).
Two-color palette with dithered pattern. The wave reads as flowing bands or stripes. The dither adds a retro, pixel-art texture. Continuous animation.
Retro and minimal. The Bayer dither is the distinctive feature. Low complexity with color and backgroundColor props.
Dependencies
| Package | Type |
|---|---|
| @react-three/fiber | NPM |
| react | NPM |
| three | NPM |