# Footer 03

> A simple footer.

A shadcn/ui block from the [@designali](https://designali.com) registry, listed on [shadcn.exchange](https://shadcn.exchange/r/designali/footer-03).

- Page, with a live preview: https://shadcn.exchange/r/designali/footer-03
- Screenshot: https://abzjhwgwpdpz7ua5.public.blob.vercel-storage.com/shots/designali/footer-03-light-4c838dfba5ae1b60.png
- Registry item: https://designali.com/r/footer-03.json
- Categories: footer
- Listed: 2026-10-13, source last changed 2026-10-13

## Install

```bash
npx shadcn@latest add https://designali.com/r/footer-03.json
```

Run it in a project that has shadcn/ui set up. It adds the files below and installs what they depend on.

## Files

### `registry/designali/blocks/footer/footer-03/footer.tsx`

```tsx
"use client"

import Link from "next/link"

const links = [
  {
    title: "Features",
    href: "#",
  },
  {
    title: "Solution",
    href: "#",
  },
  {
    title: "Brands",
    href: "#",
  },
  {
    title: "Pricing",
    href: "#",
  },
  {
    title: "Design",
    href: "#",
  },
  {
    title: "AI",
    href: "#",
  },
]

export default function Footer() {
  return (
    <div className="flex min-h-svh w-full items-center justify-center">
      <footer className="w-full border-y py-12">
        <div className="mx-auto max-w-5xl px-6">
          <div className="flex flex-wrap justify-between gap-6">
            <span className="order-last block text-center text-sm text-muted-foreground md:order-first">
              © {2026} Ali Imam, All rights reserved
            </span>
            <div className="order-first flex flex-wrap justify-center gap-6 text-sm md:order-last">
              {links.map((link, index) => (
                <Link
                  key={index}
                  href={link.href}
                  className="block text-muted-foreground duration-150 hover:text-primary"
                >
                  <span>{link.title}</span>
                </Link>
              ))}
            </div>
          </div>
        </div>
      </footer>
    </div>
  )
}
```