BG-03BackgroundsUpdated, October 14, 2026
Shape Hero
A landing hero where shapes drop in, pile up under the headline and can be grabbed and thrown.
no extra packages
PRODither Reveal Hero and more like it are in Kokonut UI Pro
Installation
Shape Hero is a free, open-source React component in the Kokonut UI Backgrounds collection. Add it with the shadcn CLI, which copies the source into components/kokonutui/shape-hero.tsx, so the code is yours to change.
npx shadcn@latest add @kokonutui/shape-heroUsage
import ShapeHero from "@/components/kokonutui/shape-hero";
export default function Example() {
return <ShapeHero />;
}Dependencies
Built with React and Tailwind CSS.