Components
Siri Wave
Siri-style GLSL shaders on a raw WebGL canvas — an iOS voice waveform with chromatic aberration and a fluid-dots metaball orb that merges, scatters and gathers. Dependency-free, two variants via a single variant prop.
import { SiriWave } from "@/components/ui/siri-wave"
export default function SiriWaveDemo() {
return (
<div className="flex min-h-screen w-full items-center justify-center bg-[#0a0a0c] p-8">
<SiriWave
variant="wave"
size={360}
className="shadow-[0_20px_60px_rgba(0,0,0,0.6)]"
/>
</div>
)
}
More examples
Fluid DotsOpen page →
