Minimal Centered Footer

An airy, fully centered footer: a parenthetical label sits above a single oversized closing statement and a pill CTA, with one centered nav row, social links, and a ruled copyright line.

By Staaarter Team

Footer

Docs

Live preview

Docs

Installation

A real shadcn registry command, not a copy-paste stand-in: it fetches this block plus its button dependencies and any missing npm packages, and installs them straight into your project.

npx shadcn add https://staaarter.com/r/airy-centered-footer.json

Prefer not to use the CLI? Copy the source from the Code toggle above into src/components/blocks/footer/footer14.tsx instead.

Usage

The file also exports footer14Demo, the exact props behind the preview above. Spread it to get a working section in one line, then replace it with your own data.

import { Footer14, footer14Demo } from "@/components/blocks/footer/footer14";

export default function Page() {
  return <Footer14 {...footer14Demo} />;
}

Props

Prop	Type	Default	Description
label	string	none	Parenthetical label above the statement, rendered as (label).
statement	string	none	Single oversized closing statement.
ctaLabel	string	none	Label for the pill CTA button.
ctaHref	string	"/contact"	Link target for the pill CTA button.
navLinks	FooterLink[]	none	Single centered row of nav links.
socials	FooterLink[]	[]	Centered row of social links below the nav.
copyright	string	none	Copyright line below a ruled divider at the very bottom.
className	string	none	Extra classes for the outer footer element.

Types

type FooterLink = { label: string; href: string };

Behavior notes

This is a plain server component with no interactivity; the pill CTA links via the button's render prop and is a normal navigation link, not a submit action.
Every element is centered and stacked in a single narrow column, deliberately airier than the other footers in this category.

More Footer Blocks

View all →

Minimal Centered Footer

Compact centered footer with a lowercase wordmark, tagline, uppercase link row, and a social row over a hairline rule.

CTA Footer

Footer opening with a light closing heading and accent buttons, then a slim wordmark and link bottom bar.

Editorial Newsletter Footer

Light footer with a wordmark, tagline, newsletter signup, three link columns, and a legal bottom bar.

Brand Column Footer

Four-column footer with a wide brand column, oversized wordmark, and three ruled link columns.

Live Studio Clock Footer

Footer built around a real ticking clock with a pulsing open/closed status, city, and day.

Split CTA Footer

Two-column footer with a pill CTA and email on the left, a stacked oversized nav on the right.