AetherHero

Heroes 639

About

Animated Hero Section

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

Code

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

Usage.tsx


import { AetherHero } from "@/components/ui/aether-hero";


export default function DemoOne() {
  return (
    <AetherHero
      title="Build launch-grade UI in hours."
      subtitle="Animated WebGL backdrop, crisp type, and accessible CTAs. Drop it into any Next.js page."
      ctaLabel="Explore Docs"
      ctaHref="#docs"
      secondaryCtaLabel="GitHub"
      secondaryCtaHref="https://github.com/rahil1202"
      align="left"
      overlayGradient="linear-gradient(180deg, #000000bb 0%, #00000055 40%, transparent)"
    />
  );
}