Components
Arc Reveal Hero
A cycle of short declarative beats: Quiet, Sharp, Calm, Crafted- fades through a calm white surface, then a curved black curtain rises from below to reveal the landing. The boundary stays a single smooth arc the whole way up, never a flat slide.
import { ArrowUpRight } from "lucide-react";
import { ArcRevealHero } from "@/components/ui/arc-reveal-hero";
export default function ArcRevealHeroDemo() {
return (
<ArcRevealHero>
<div className="flex min-h-screen w-full items-center justify-center px-6">
<p className="text-center text-base text-white/80 md:text-lg">
Your crazy landing page.
</p>
</div>
</ArcRevealHero>
);
}
Dependencies
Published
Similar components
Explore more
Part of Ruixen UI — browse the full library on 21st.dev.