Footer

layout

A full-featured footer with animated marquee text, navigation links, social icons, and copyright info. Highly customizable with prop-driven content.

Let'sBuildSomething.Let'sBuildSomething.Let'sBuildSomething.Let'sBuildSomething.
Available

Your Name

Building fast, reliable web experiences with modern tools.

© 2026 Your Name. All rights reserved.

1Installation

Install the package:

$npm install piece-ui

Import the component:

tsx
1import { Footer } from "piece-ui";

2Usage

Basic usage

tsx
1import { Footer } from "piece-ui";
2
3export default function Example() {
4  return (
5    <Footer
6      marqueeText="Available for freelance work · Let's build something great ·"
7      navLinks={[
8        { label: "About", href: "/about" },
9        { label: "Projects", href: "/projects" },
10        { label: "Contact", href: "/contact" },
11      ]}
12      socialLinks={[
13        { platform: "github", href: "https://github.com/username" },
14        { platform: "twitter", href: "https://twitter.com/username" },
15      ]}
16      copyright="© 2025 Your Name. All rights reserved."
17    />
18  );
19}

3Props

PropType
marqueeText
string
navLinks
{ label: string; href: string }[]
socialLinks
SocialLink[]
copyright
string