Components
Aether Flow
fragment shader is designed to be more visually creative, generating a flowing, multi-layered "river" of cosmic energy. It combines several layers of procedural noise that move at different speeds to create a sense of depth. The effect is fully interactive, reacting to your mouse movements by creating beautiful warps and ripples in the flow.
import ShaderCanvas from "@/components/ui/aether-flow";
const settings = {
hue: 280,
speed: 1,
intensity: 1,
complexity: 6,
warp: 0.5,
};
export default function Demo(props: Partial<typeof settings>) {
const s = { ...settings, ...props };
return (
<div className="h-screen w-screen relative bg-black">
<ShaderCanvas
hue={s.hue}
speed={s.speed}
intensity={s.intensity}
complexity={s.complexity}
warp={s.warp}
/>
</div>
);
}