1

Wordmark

A footer that ends on the brand: four link columns and a home mark, a bottom bar, then a bold wordmark set edge to edge with tight spacing, ending at the page edge.

Dependencies

@radix-ui/react-slot@hugeicons/react@hugeicons/core-free-icons

Interaction Type

A footer landmark with labelled nav regions. Links brighten from muted to foreground on hover and keyboard focus, with the accent focus ring. Links grow to 44px targets on touch screens, and icon links always are.

Props

Options you can pass to customize this component.

Prop
Type
Description
wordmark
string

Text stretched to the full width. Hidden from screen readers. Defaults to "Nexvyn UI".

mark
ReactNode

Small logo linking home. Pass null to hide it.

homeHref
string

Where the mark links.

homeLabel
string

Accessible name of the mark link. Defaults to "Nexvyn UI home".

columns
{ title: string; links: { label: string; href: string }[] }[]

Titled link columns.

legal
{ label: string; href: string }[]

Links on the bottom bar.

copyright
ReactNode

Small print line. Defaults to "© 2026 Nexvyn". Pass null to hide it.

className
string

Merged onto the footer with cn().

Installation

npx shadcn@latest addhttps://ui.nexvyn.dev/r/footer-wordmark.json

How to use

<FooterWordmark wordmark="Acme" homeHref="/" homeLabel="Acme home" />

Source Code

Click the code icon in the top-right corner to view the source code.

Contact

Questions or feedback? Reach out anytime.

License & Usage

  • •Free for personal and commercial use
  • •No attribution required
  • •Cannot be resold as a standalone product
  • •Anatomy/blueprint diagrams are licensed separately (CC BY-NC 4.0) and are not for commercial use
// No code loaded.
acme.app
npx shadcn@latest addhttps://ui.nexvyn.dev/r/footer-wordmark.json