How do I add this to my project?

Copy the install command and paste it into Claude Code. It handles everything - downloads the component, installs dependencies, and adds it to your project.

Can I customize the styling?

Yes! Just tell Claude Code what you want. Example: 'Change the background to dark mode' or 'Add social media icons'. It will update the component for you.

How do I change the navigation links?

Edit the navigationColumns array at the top of the component. Each column has a title and array of links. Add, remove, or reorder columns as needed. You can also change the brand logo URL and tagline text.

FooterFree

Footer Mega 1

A comprehensive footer with 5 navigation columns, brand section, and bottom bar for legal links and copyright. Component used in Best Dubai.

Installation 30s

Run Claude Code then copy and paste this command

@5ds/framework

Sign In to Build

Join with a free account

Claude Code will install this into the /src/components folder in your project

Tell Claude Code where you want to use this

Description

A full-width mega footer that organizes your site navigation into 5 distinct columns plus a brand area.

Each column has a clickable header and 4-5 links underneath. The component uses a responsive grid that stacks to 2 columns on mobile, 3 on tablets, and spreads to 6 on desktop.

Everything is configured through the navigationColumns array at the top. Add your logo URL, swap out links, change column titles. The copyright year updates automatically.

Built with Next.js Image and Link components for optimization. Includes proper ARIA labels for accessibility.

Key Features

5 navigation columns with configurable links

Responsive grid (2 cols mobile → 6 cols desktop)

Brand section with logo and tagline

Bottom bar for Terms/Privacy links

Auto-updating copyright year

Use Cases

Adding a comprehensive footer to your SaaS app

Organizing site navigation for content-heavy sites

Building a multi-product landing page footer

Creating a footer for documentation sites

Frequently Asked Questions

Join Dan, Zehra and 0 others building AI businesses in days with video tutorials and 1 on 1 support.

Used In

Best Dubai

Dependencies

noneshadcn/none

These will be automatically installed when you add this component to your project.

AppWebsiteSaaSE-commDirectoryIdeaAI Business, In Days

Join 0 others building with AI