Footer Mega
Footers
Source and install need .
pnpm dlx shadcn@latest add @assembli/footer-ctaFooter CTA
A closing call to action that runs into a compact footer. The band sits on a faint 24-column time-zone grid lit at the current UTC hour, and the page ends on a row of live office clocks showing each city's local time, day or night, whether it's open, and how far it is from the viewer.
- Dependencies
- lucide-react(npm, opens in a new tab)
Props
Other props pass through to the root element.
eyebrow
React.ReactNode
headline*
React.ReactNode
description
React.ReactNode
primaryAction*
FooterCtaLink
secondaryAction
FooterCtaLink
note
React.ReactNode
Small print under the buttons, e.g. trust signals.
brand*
string
brandHref
string
Default
"/"Where the brand mark links. Defaults to "/".
logo
React.ReactNode
links
FooterCtaLink[]
Default
[]legal
FooterCtaLink[]
Default
[]copyright
React.ReactNode
offices
FooterCtaOffice[]
Default
[]officesLabel
React.ReactNode
Default
"Where we work"clock
"12h" | "24h"
Default
"24h"
| Prop | Type | Default | Description |
|---|---|---|---|
| eyebrow | React.ReactNode | – | |
| headline* | React.ReactNode | – | |
| description | React.ReactNode | – | |
| primaryAction* | FooterCtaLink | – | |
| secondaryAction | FooterCtaLink | – | |
| note | React.ReactNode | – | Small print under the buttons, e.g. trust signals. |
| brand* | string | – | |
| brandHref | string | "/" | Where the brand mark links. Defaults to "/". |
| logo | React.ReactNode | – | |
| links | FooterCtaLink[] | [] | |
| legal | FooterCtaLink[] | [] | |
| copyright | React.ReactNode | – | |
| offices | FooterCtaOffice[] | [] | |
| officesLabel | React.ReactNode | "Where we work" | |
| clock | "12h" | "24h" | "24h" |
