# Footer Minimal

> Compact site footer for products that don't need a sitemap: brand and tagline beside one row of links with hover underlines and an optional badge, then a bottom bar with copyright and legal links, a live status pill, a language select, a light/system/dark switch with a sliding thumb and arrow-key support, social icons and back to top. Each optional piece hides when unset.

- Slug: `footer-minimal`
- Category: [Footers](https://www.assembli.design/category/footers.md)
- Type: block
- Tags: footer, minimal, status, theme-switch, language, social-links
- npm dependencies: motion, lucide-react
- shadcn/ui dependencies: none
- Live preview: https://www.assembli.design/preview/footer-minimal
- Page: https://www.assembli.design/components/footer-minimal

![Footer Minimal preview](https://www.assembli.design/thumbnails/footer-minimal-light.png)

## Props

Other props pass through to the root element.

| Prop | Type | Default | Description |
| --- | --- | --- | --- |
| `brand` (required) | `{ name: string; logo?: React.ReactNode; href?: string; tagline?: React.ReactNod…` |  |  |
| `links` (required) | `{ label: string; href: string; badge?: string }[]` |  |  |
| `legal` | `{ label: string; href: string }[]` | `[]` |  |
| `copyright` | `React.ReactNode` |  | Defaults to "© <brand>". Pass the year yourself, e.g. "© 2026 Quillmark, Inc.". |
| `status` | `{ label: string; href: string; tone?: "ok" \| "degraded" \| "down" }` |  | A live status pill linking to your status page. |
| `socials` | `FooterSocial[]` | `[]` |  |
| `locales` | `{ value: string; label: string }[]` | `[]` | Language picker. Hidden without `onLocaleChange`. |
| `locale` | `string` |  |  |
| `onLocaleChange` | `(value: string) => void` |  |  |
| `theme` | `FooterTheme` | `"system"` | Light / system / dark switch. Hidden without `onThemeChange`. |
| `onThemeChange` | `(theme: FooterTheme) => void` |  |  |
| `backToTop` | `boolean` | `true` | Shows a back-to-top button. |

## Install

One-time setup (needs a subscription):

1. Add the registry to the project's `components.json`: `{"@assembli":{"url":"https://www.assembli.design/r/{name}.json","headers":{"Authorization":"Bearer ${ASSEMBLI_API_KEY}"}}}` (merge into `"registries"`).
2. Put an API key from https://www.assembli.design/account in `.env.local` as `ASSEMBLI_API_KEY=asm_…`.

Then install with the shadcn CLI (writes `components/footer-minimal/footer-minimal.tsx` and installs dependencies):

```bash
npx shadcn@latest add @assembli/footer-minimal
```

Registry item JSON: https://www.assembli.design/r/footer-minimal.json (send `Authorization: Bearer <api key>`)

## Code

> Component source needs an Assembli subscription ($12/month or $96/year) and an API key sent as `Authorization: Bearer <key>`. To get one without copying anything, POST https://www.assembli.design/api/agent/login (or call the MCP tool connect_account), show the user the link it returns, and poll https://www.assembli.design/api/agent/token for the key. Or subscribe at https://www.assembli.design/pricing and create a key at https://www.assembli.design/account.
