Site footer with a brand, grouped navigation links, free content and a legal line; the groups stack on small screens and sit in columns from the medium breakpoint.
Examples of v0.1.2 are shown as code; only the latest version runs live. Open the live examples →
A footer with a brand, three link groups, contact content and a legal line.
Basic Site Footer
1const BasicSiteFooter = () => (2 <SiteFooter3 brand="The BeHive"4 legal="© 2026 The BeHive"5 groups={[6 {7 title: "Your stay",8 links: [9 { label: "House guide", href: "#guide" },10 { label: "Wifi", href: "#wifi" },11 ],12 },13 { title: "Art", links: [{ label: "The artists", href: "#artists" }] },14 ]}15 >16 <a href="mailto:hello@example.com">hello@example.com</a>17 </SiteFooter>18);1920render(<BasicSiteFooter />);
Without groups the footer shows only the brand and the legal line.
Brand Only Site Footer
1const BrandOnlySiteFooter = () => (2 <SiteFooter brand="The BeHive" legal="© 2026 The BeHive" />3);45render(<BrandOnlySiteFooter />);