A large footer with a newsletter card, a brand column with social buttons, five link columns, and a bottom row with legal links, a live status pill and a language selector.
npx shadcn@latest add https://hyperblur.dev/r/footer-mega.jsonWorks in any React project set up with the shadcn CLI. The file lands in components/hyperblur/footer-mega.tsx.
import { FooterMega } from "@/components/hyperblur/footer-mega"
<FooterMega brand="Arcfield" onSubscribe={(email) => console.log(email)} />| Prop | Type | Default | Description |
|---|---|---|---|
| brand | string | "Arcfield" | Product name next to the logo mark. |
| tagline | string | "The data platform for teams that ship every day..." | Short text under the brand. |
| columns | { title: string; links: { label: string; href: string; badge?: string }[] }[] | Product, Solutions, Developers, Resources, Company | Link columns. A badge renders a small pill after the link. |
| newsletter | { title: string; description: string; placeholder?: string; button?: string } | null | The monthly changelog | Content of the newsletter card. Pass null to hide it. |
| onSubscribe | (email: string) => void | Called with a valid email when the form is submitted. | |
| socials | { id: "x" | "github" | "linkedin" | "youtube" | "discord"; href: string; label?: string }[] | All five networks | Icon buttons in the brand column. |
| languages | { code: string; label: string }[] | English, Deutsch, Français, Español, Japanese, Português | Options of the language selector. Pass an empty array to hide it. |
| language | string | Controlled language code. Pair with onLanguageChange. | |
| defaultLanguage | string | "en" | Selected language code when uncontrolled. |
| onLanguageChange | (code: string) => void | Called when the language changes. | |
| status | { label: string; href: string; tone?: "ok" | "degraded" | "down" } | null | { label: "All systems normal", href: "#", tone: "ok" } | Status pill with a pulsing dot colored by tone. Pass null to hide it. |
| legal | { label: string; href: string }[] | Privacy, Terms, Cookies, DPA, Security | Links in the bottom row. |
| copyright | string | "© 2026 Arcfield Labs ApS" | Copyright line. |
| accent | string | "#22d3ee" | Color of the top beam, logo, badges, link markers, the subscribed state and focus rings. |