Footer

A footer with grouped link columns, brand details, and an optional card callout.

Installation

bunx shadcn@latest add https://ui.razeev.com/r/footer.json

Usage

tsx

import { Footer } from "@/components/hangry-ui/blocks/footer";

<Footer
  brand="Acme"
  description="Tools for your next idea."
  copyright="© 2026 Acme"
  githubHref="https://github.com/acme"
  groups={[
    { title: "Company", links: [
      { label: "About", href: "/about" },
      { label: "Contact", href: "/contact" },
    ] },
  ]}
  callout={{
    title: "Build something new",
    description: "Explore the component collection.",
    label: "Get started",
    href: "/components",
  }}
/>

Footer

A compact footer with inline navigation and a copyright bar.

Installation

bunx shadcn@latest add https://ui.razeev.com/r/footer-minimal.json

Usage

tsx

import { FooterMinimal } from "@/components/hangry-ui/blocks/footer-minimal";

<FooterMinimal
  brand="Acme"
  description="Tools for your next idea."
  copyright="© 2026 Acme"
  githubHref="https://github.com/acme"
  groups={[
    { title: "Company", links: [
      { label: "About", href: "/about" },
      { label: "Contact", href: "/contact" },
    ] },
  ]}
  callout={{
    title: "Build something new",
    description: "Explore the component collection.",
    label: "Get started",
    href: "/components",
  }}
/>

Footer

A centered footer with stacked brand details and navigation.

Installation

bunx shadcn@latest add https://ui.razeev.com/r/footer-stacked.json

Usage

tsx

import { FooterStacked } from "@/components/hangry-ui/blocks/footer-stacked";

<FooterStacked
  brand="Acme"
  description="Tools for your next idea."
  copyright="© 2026 Acme"
  githubHref="https://github.com/acme"
  groups={[
    { title: "Company", links: [
      { label: "About", href: "/about" },
      { label: "Contact", href: "/contact" },
    ] },
  ]}
  callout={{
    title: "Build something new",
    description: "Explore the component collection.",
    label: "Get started",
    href: "/components",
  }}
/>