# Large 15

> A centred logo and row of links, then copyright and legal links.

URL: https://apogee.avaui.dev/docs/footers-sections/large-15
Last updated: 2026-10-20

A centred logo and row of links, then copyright and legal links.

Last updated October 20, 2026

Live example: https://apogee.avaui.dev/examples/footers/large-15

```astro
---
/**
 * Large 15: A centred logo and row of links, then copyright and legal links.
 *
 * @block footers
 * @order 15
 */
import { Orbit } from '@lucide/astro'
import Section from '@/components/apogee/Section/Section.astro'
import FeaturedIcon from '@/components/apogee/FeaturedIcon/FeaturedIcon.astro'
import Link from '@/components/apogee/Link/Link.astro'
import { type FooterContent } from '@/components/apogee/sections/_shared/footers.ts'

/** @composable */
interface Props extends FooterContent {}

const {
  brand = 'Example',
  columns = [{ heading: 'Footer', links: [{ label: 'Overview', href: '#' }, { label: 'Features', href: '#' }, { label: 'Pricing', href: '#' }, { label: 'Careers', href: '#' }, { label: 'Help', href: '#' }, { label: 'Privacy', href: '#' }] }],
  navLabel = 'Footer',
  copyright = '© 2026 Example. All rights reserved.',
  legal = [{ label: 'Terms', href: '#' }, { label: 'Privacy', href: '#' }, { label: 'Cookies', href: '#' }],
} = Astro.props
const flat = columns.flatMap((c) => c.links)
---

<Section as="footer" spacing="medium">
  <div class="flex flex-col items-center gap-8">
    <Link href="/" color="inherit" underline="none" class="inline-flex items-center gap-2 text-lg font-semibold "><FeaturedIcon theme="solid" color="primary" size="small"><Orbit /></FeaturedIcon>{brand}</Link>
    {flat.length > 0 && <nav aria-label={navLabel} class=""><ul class="grid list-none grid-cols-2 gap-x-8 gap-y-3 p-0 sm:flex sm:flex-wrap">{flat.map((l) => <li><Link href={l.href} color="neutral" underline="hover" class="font-semibold">{l.label}</Link></li>)}</ul></nav>}
  </div>
  <div class="mt-12 md:mt-16 flex flex-col-reverse gap-6 border-t border-neutral pt-8 md:flex-row md:items-center md:justify-between">
    {copyright && <p class="text-neutral-faded ">{copyright}</p>}
    {legal && <nav aria-label="Legal"><ul class="flex list-none flex-wrap gap-x-6 gap-y-2 p-0 text-neutral-faded">{legal.map((l) => <li><Link href={l.href} color="inherit" underline="hover">{l.label}</Link></li>)}</ul></nav>}
  </div>
</Section>
```

## Add

```sh
npx @ava-ui/apogee add footers/large-15
```

This copies the block to `src/components/apogee/blocks/footers/` with everything it uses: FeaturedIcon, Link, Section. Every piece of copy is a prop, with the sample copy as its default. Pass yours, or `null` to hide a part; see [copy is props](https://apogee.avaui.dev/docs/footers-sections#copy-is-props).

## Accessibility

-   The block is the page’s `<footer>` landmark; each link column is a `<nav>` named after its heading.

## Related

[

FooterA site footer shell for link columns and a bottom copyright row.

](https://apogee.avaui.dev/docs/footer)[

LinkAn inline text link — for a link that should look like a button, use Button with href instead.

](https://apogee.avaui.dev/docs/link)[

InputA labeled text field with hint/error messaging, wired for accessibility — plus a pure-CSS floating label.

](https://apogee.avaui.dev/docs/input)