Shadcn.io is not affiliated with official shadcn/ui
Referral Footer Block
A React referral program footer block for Next.js with invite banner, referral code display, copy button, share link, and navigation columns using shadcn/ui and Tailwind CSS
Drive organic growth with this React and Next.js referral program footer block. Features an invite friends banner with a compelling rewards message, a referral code displayed in a dark mono code box with a ghost copy button using CheckIcon and CopyIcon state swap, two organized navigation link columns, a share your link button, and copyright. Built with TypeScript, shadcn/ui Button components, Framer Motion staggered entrance animations, react-wrap-balancer, Lucide React icons, and Tailwind CSS. Ideal for SaaS platforms, subscription services, marketplace apps, and any product leveraging viral loops and word-of-mouth referral mechanics to reduce customer acquisition costs.
Referral Footer Block preview
Installation
Related Components
CTA Footer
Footer with call-to-action banner
Upgrade Footer
Footer with upgrade CTA
Newsletter Footer
Footer with email signup form
SaaS Footer
SaaS product footer block
Company Footer
Footer with company description
Subscription Footer
Footer with plan details
FAQ
Was this page helpful?
Sign in to leave feedback.
Real Estate Footer Block
A React real estate footer block for Next.js with three navigation columns, licensed badge, Equal Housing notice, and copyright using shadcn/ui and Tailwind CSS
Restaurant Footer Block
A React restaurant footer block for Next.js with brand tagline, hours of operation, location, two navigation columns, order online button, and copyright using shadcn/ui and Tailwind CSS