Animated Footer

Footers 379

About

A sleek, animated footer component inspired by Cluely.com. It replicates the smooth interactions and modern layout of the original design perfect for landing pages, portfolios, or any site that values high-end visual polish. Built with responsive design in mind and ready to drop into your Next.js + Tailwind projects. ✅ Smooth animation ✅ Fully responsive ✅ Dark mode ready ✅ Pixel-perfect Cluely look

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

Code

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

Usage.tsx

import Footer from "@/components/ui/animated-footer";

const DemoOne = () => {
  return  <Footer
          leftLinks={[
            { href: "/terms", label: "Terms & policies" },
            { href: "/privacy-policy", label: "Privacy policy" },
          ]}
          rightLinks={[
            { href: "/careers", label: "Careers" },
            { href: "/about", label: "About" },
            { href: "/help-center", label: "Help Center" },
            { href: "https://x.com/taher_max_", label: "Twitter" },
            { href: "https://www.instagram.com/taher_max_", label: "Instagram" },
            { href: "https://github.com/tahermaxse", label: "GitHub" },
          ]}
          copyrightText="Cluely 2025. All Rights Reserved"
          barCount={23}
        />;
};

export { DemoOne };