Shadcn.io is not affiliated with official shadcn/ui
React Referral Program Settings Block
Animated React referral program settings page for Next.js with reward tiers, referral link sharing, invite tracking, and commission configuration built with shadcn/ui, Tailwind CSS, and framer-motion
Manage your referral program with this React and Next.js settings block. Features a shareable referral link with copy action, reward tier configuration, invite tracking with status indicators, and commission percentage controls. Built with TypeScript, shadcn/ui Input, Button, Badge, and Switch, Tailwind CSS, and framer-motion staggered entrance animations.
React Referral Program Settings Block preview
Installation
Related Components
Billing Settings
Plan, payment method, and invoices
Profile Settings
Name, email, avatar, and timezone
Notification Settings
Email, push, and SMS preferences
Social Links Settings
Platform URLs and display order
Email Preferences
Frequency, digest, and unsubscribe
Security Settings
Password, 2FA, and session management
FAQ
Was this page helpful?
Sign in to leave feedback.
React Rate Limit Configuration Settings Block
Animated React rate limit configuration settings page for Next.js with tier-based limits, burst allowance, custom rules, and usage monitoring built with shadcn/ui, Tailwind CSS, and framer-motion
React Registration Fields Settings Block
Animated React registration form field configuration page for Next.js with drag-to-reorder fields, required and optional toggles, field type selection, and validation rules built with shadcn/ui, Tailwind CSS, and framer-motion