Back to Dictionary
Empty & Error States
●○○Ready to Use
First Run Onboarding Pulse
A glowing, pulsating ring around a specific UI element intended to draw a brand new user's attention to the first action they should take.
Live Demo
Welcome! 👋
Your first step is to connect a data source so we can start analyzing.
What It Is
A glowing, pulsating ring around a specific UI element intended to draw a brand new user's attention to the first action they should take.
✓When to Use
- First-time logins
- Introducing a brand new core feature in a dense UI
✕When NOT to Use
- Everyday use
- On multiple elements concurrently
Configuration Tips
- 01Similar to pulsing-hotspot but larger, acting as an outline shadow (box-shadow or ring-offset)
- 02Fade it out completely once clicked
You've Seen It In
IntercomSlackCanva
Prompt Templates
Copy and paste these prompts into your AI coding assistant.
Add a pulsing glow effect around my "Create Project" button that flashes infinitely to draw a new user's eyes.
Code Example (Tailwind CSS)
export function FirstRunPulseDemo() {}