Image Transition Shader

Shadcn UI Shader Block

Shader10 is a full-screen shader background built with shadcn/ui and React Three Fiber, blending between two texture inputs. The shader applies a lens distortion and bubble-style transition based on a progress uniform. Progress is driven by transitionDuration and pauseDuration props. Fallback Unsplash images are used when no textures are provided.

Full-color image content. The transition uses a sphere-based distortion. The effect reads as a magnifying lens or bubble. Looping animation.

Content-driven: requires two image URLs. The lens distortion transition is distinctive. Moderate complexity with transition and pause props.