Stop Rebuilding UI

Shadcn.io is not affiliated with official shadcn/ui

Referral Accepted Notification Block

A referral accepted notification block for React and Next.js with user avatar, credit reward display, referral link with copy button, invite CTA, and program stats built with shadcn/ui and Tailwind CSS

Drive viral growth with this referral accepted notification block for React and Next.js. Features a UserPlusIcon header announcing the accepted invite, a credit reward earned indicator, a referral link display with ghost copy button, an Invite More CTA, and referral program statistics footer. Built with TypeScript, shadcn/ui Button and Badge components, Framer Motion staggered animations, react-wrap-balancer, and Tailwind CSS. Perfect for SaaS referral programs, affiliate dashboards, and invite-based growth flows.

Referral Accepted Notification Block preview

Loading...
Scroll to load preview

Installation

Install
Pro block

FAQ

Last updated on March 24, 2026

Was this page helpful?

Sign in to leave feedback.