Activity Badge
A customizable activity badge with smooth animations to display status or presence in your UI.
About This Component
Choose between preset states (green, orange, red) or define your own custom color. Add subtle motion with three animation styles—Pulse, Shake, or Glow—and fine-tune the behavior to match your design.
Customization options include:
Pulse: expanding rings (1, 2, or 3) with adjustable scale and opacity
Shake: subtle left-right motion, perfect for attention or “active” feedback
Glow: soft luminous effect for a clean, ambient highlight
Full control over animation duration, easing, and delay
Custom badge size (works at any dimension)
Adjustable border radius (from circle to rounded square)
Preset or fully custom colors
Clean, lightweight, and easy to integrate into any layout.
Perfect for availability indicators, dashboards, chat interfaces, or live status UI elements.
Note: Parent Stacks/Frames must have Overflow set to Visible, otherwise the animation may be clipped.
