Get everything for $99, lifetime

Components

Warp

Pro

Installation

ProRequires a Planes Pro license.
npx shadcn add @useplanes/warp

Works once the @useplanes registry is set up in your project (one-time). After that, copy and run commands directly.

Unlock with Planes Pro

$99 once · 160 Pro components · lifetime updates.

I have a licenseGet Pro
import { Warp } from "@/components/ui/Warp";

<div className="h-[480px] bg-black">
  <Warp speed={1} intensity={1} />
</div>

Use cases

  • Hero background

    Sit the headline over the dark upper area; the ribbons brighten toward the bottom, so copy stays legible.

  • Launch or announcement page

    Forward motion for a release, a countdown or a waitlist.

  • Dark CTA band

    Ambient speed behind one button without competing with the copy.