Social Badges
Creator and social platform badge system — verification tiers, creator roles, account types, community roles, achievement badges, and live activity indicators.
When to Use
Use in social platforms, community tools, creator marketplaces, and any product with user roles, tiers, or public profiles.
Best Practices
Keep verification badges compact — they appear inline with usernames. Use gradient badges only for top-tier account types to preserve their premium signal.
Why This Component Matters
Role and verification badges communicate trust and authority instantly. They reduce the cognitive load of evaluating a user's credibility.
FAQ
QHow is the Verified badge different from Verified+?
Verified uses a sky-blue ring (platform verification), Verified+ uses gold (top creator status). Both use CheckCircle from lucide-react.
QCan Live Now pulse on mount?
Yes — it uses a Framer Motion loop animation. You can control the pulse duration via the transition prop.
Related Components
Liquid Stretch
Smooth liquid motion accordion with natural spring animations.
Split Screen
Split screen accordion with expanding image partitions — click a panel to reveal its content.
Audio Reactive
Audio-reactive accordion with animated waveform bars and a progress track.
