Recent Activity Feed Generator
Create a recent activity feed widget showing live user actions like signups, purchases, and reviews. Build trust with real-time social proof.
Live Preview
⚡ Recent Activity
- Sarah signed up2m ago
- John made a purchase5m ago
- Emily left a review8m ago
- Mike added to cart12m ago
- Lisa subscribed15m ago
Generated Code
<style>
.af-widget{background:#ffffff;border-radius:10px;padding:16px;font-family:system-ui,sans-serif;max-width:360px;box-shadow:0 2px 12px rgba(0,0,0,0.08)}
.af-title{font-size:14px;font-weight:700;color:#1a1a2e;margin:0 0 12px;display:flex;align-items:center;gap:8px}
.af-list{list-style:none;padding:0;margin:0;max-height:220px;overflow:hidden}
.af-item{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid #1a1a2e10;font-size:13px;color:#1a1a2e;animation:af-fade .4s ease}
.af-item:last-child{border:none}
.af-dot{width:6px;height:6px;border-radius:50%;background:#22c55e;flex-shrink:0}
.af-name{font-weight:600}
.af-time{font-size:11px;opacity:.5;margin-left:auto;white-space:nowrap}
@keyframes af-fade{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
</style>
<div class="af-widget">
<div class="af-title">⚡ Recent Activity</div>
<ul class="af-list">
<li class="af-item"><span class="af-dot"></span><span><span class="af-name">Sarah</span> signed up</span><span class="af-time">2m ago</span></li>
<li class="af-item"><span class="af-dot"></span><span><span class="af-name">John</span> made a purchase</span><span class="af-time">5m ago</span></li>
<li class="af-item"><span class="af-dot"></span><span><span class="af-name">Emily</span> left a review</span><span class="af-time">8m ago</span></li>
<li class="af-item"><span class="af-dot"></span><span><span class="af-name">Mike</span> added to cart</span><span class="af-time">12m ago</span></li>
<li class="af-item"><span class="af-dot"></span><span><span class="af-name">Lisa</span> subscribed</span><span class="af-time">15m ago</span></li>
</ul>
</div>