Skip to main content
Footer component preview Open /components/Footer.tsx:
const NAV_SECTIONS = [
  {
    heading: "Product",
    items: [
      { text: "Features", url: "#features" },
      { text: "Pricing", url: "#pricing" },
      { text: "FAQ", url: "#faq" },
    ],
  },
  {
    heading: "Company",
    items: [
      { text: "About", url: "/about" },
      { text: "Blog", url: "/blog" },
      { text: "Contact", url: "/contact" },
    ],
  },
]
Add, remove, or rename sections as needed.
const SOCIALS = [
  { icon: <Twitter className="size-5" />, url: "https://twitter.com/yourhandle", name: "Twitter" },
  { icon: <Github className="size-5" />, url: "https://github.com/yourusername", name: "GitHub" },
]
Remove socials you don’t use. Import icons from lucide-react.
const LEGAL_LINKS = [
  { text: "Terms of Service", url: "/tos" },
  { text: "Privacy Policy", url: "/privacy" },
]
Legal pages are already set up at /app/tos/page.tsx and /app/privacy/page.tsx. Edit those files to add your actual terms and privacy policy.

Brand Info

Logo and tagline come from /config.ts:
/config.ts
export const config = {
  name: "YourApp",
  description: "Launch your SaaS in days",
  logoUrl: "/logo.svg",
  siteUrl: "https://yourdomain.com",
}

Update your Terms of Service and Privacy Policy. The default templates are placeholders - you need real legal pages before launching.
Keep footer navigation simple. 2-3 columns max. More than that, nobody reads them.