Components
Loading preview...
Animated radial glow that rises from any edge — top, bottom, left, or right. Built with Framer Motion, zero dependencies beyond motion/react.
@ahammed_bashar
npx shadcn@latest add https://21st.dev/r/ahammed.bashar9/glow-horizonimport GlowHorizonFM from "@/components/ui/glow-horizon";
import { AnimatedTitleFM } from "../components/ui/glow-horizon-utils/animated-title-fm";
export default function GlowHorizonDemo() {
return (
<div style={{ width: "100%", height: "100vh", position: "relative", overflow: "hidden", background: "#050507" }}>
<GlowHorizonFM variant="top" />
<div style={{ position: "absolute", inset: 0, display: "flex", flexDirection: "column", alignItems: "center", justifyContent: "center" }}>
<AnimatedTitleFM open={true} />
</div>
</div>
);
}