Components
An animated, tileable water caustic lighting effect rendered with a WebGL shader for glowing underwater ripple backgrounds.
Loading preview...
import WaterCaustic from "@/components/ui/water-caustic";
export default function WaterCausticDemo() {
return (
<div className="relative flex h-screen min-h-[600px] w-full items-center justify-center overflow-hidden bg-neutral-950">
<WaterCaustic color="#38bdf8" />
<div className="relative z-10 text-center px-6">
<h2 className="text-4xl font-semibold tracking-tight text-white sm:text-5xl">
Water Caustic
</h2>
<p className="mt-3 text-base text-neutral-300 sm:text-lg">
Animated tileable caustic lighting shader
</p>
</div>
</div>
);
}