Cloud Sea
ProInstallation
ProRequires a Planes Pro license.
pnpm dlx shadcn add @useplanes/cloud-seaWorks 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 · 164 Pro components · lifetime updates.
import { CloudSea } from "@/components/ui/CloudSea";
<div className="relative h-[560px] bg-black">
<CloudSea horizon={-0.2} speed={1} />
<h1 className="absolute inset-x-0 top-1/4 text-center text-white">
Your headline
</h1>
</div>Use cases
Hero background
Copy sits in the navy upper sky; the glow and cloud deck fill the lower third.
Travel or aviation product
Altitude without stock photography.
Calm loading or waiting screen
Constant slow motion that never goes dark or still.