Cymatic Particle Hero

Heroes

About

A full-screen landing-page hero: a 3D particle sculpture morphs between ten forms under a large headline. Built in Slider Revolution's visual editor; make it yours with a free SR Anywhere account and pass your module's embed key. No slider library in your bundle.

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

Code

How Cymatic Particle Hero is used: the demo's code. The component's own source comes with a free account.

Usage.tsx

import { SliderRevolutionHero } from "@/components/ui/cymatic-particle-hero";

// The demo key plays "Cymatic": a 3D particle sculpture that morphs between ten forms on its own.
// It runs on Slider Revolution's demo account; make your own module with a free SR Anywhere account
// (anywhere.sliderrevolution.com/platforms/ai-builders) and pass its key instead.
export function Demo() {
  return (
    <div className="w-full bg-background">
      <SliderRevolutionHero embedKey="ek_biqgfhte6l7dhaya3qyw" />
    </div>
  );
}

export default Demo;