Sonic Waveform

This one is called "Sonic Waveform." It features an interactive, generative audio waveform that ripples and distorts as you move your mouse across the screen. This creates a high-tech, data-visualization feel, as if you're interacting with a live data stream or a soundscape.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Sonic Waveform to your project and fits it to your theme.

import SonicWaveformHero from "@/components/ui/sonic-waveform";

export default function DemoOne() {
  return <main className="App bg-black">
      <SonicWaveformHero />
    </main>
}