Shader 3 block design & features
Shader3 is a full-screen shader background built with Shadcn UI and React Three Fiber, featuring a glass-like refraction effect with circular shapes. The shader uses SDF circles, fresnel, and lambert lighting. Mouse position is passed as a uniform and influences the circle positions via a hash offset. A color prop controls the tint (default mint green).
Dark base with colored rim highlights on the circles. The refraction creates a glass or lens effect. Smooth mouse tracking with lerped interpolation.
Interactive and polished. The mouse-following refraction is distinctive among shader blocks. Moderate complexity with color and custom shader support.