Components
Loading preview...
A stunning hero section component featuring an animated aurora gradient background with smooth color transitions. Perfect for landing pages, product showcases, and marketing sites. Built following shadcn/ui patterns with full theme support, accessibility features, and TypeScript type safety. The component is fully customizable through props and works seamlessly in both light and dark modes.
@dhiluxui
npx shadcn@latest add https://21st.dev/r/dhileepkumargm/aurora-hero-bgimport { AuroraHero } from "@/components/ui/aurora-hero-bg";
export default function AuroraHeroDemo() {
return (
<AuroraHero
title="Transform Your Vision"
description="Create stunning digital experiences with modern design and smooth animations"
primaryAction={{
label: "Get Started",
onClick: () => console.log("Primary action clicked"),
}}
secondaryAction={{
label: "Learn More",
onClick: () => console.log("Secondary action clicked"),
}}
/>
);
}