With Notifications

Notification panel displaying three unread notifications with badge count.

Notifications3
Build passed — 5 min ago
New user registered — 20 min ago
High CPU usage — 1 hour ago

Empty State

Notification center with zero badge count and empty message.

Notifications
No new notifications

Many Notifications

Panel with five notifications and a high badge count.

Notifications5
Deployment complete — 2 min ago
PR #145 merged — 10 min ago
New comment on issue — 25 min ago
Team member joined — 1 hour ago
Error rate spike — 2 hours ago

Security Alerts

Notification panel styled for security and system alerts.

Notifications2
Login from new device — 10 min ago
API key expiring soon — 3 hours ago

Usage

<NotificationCenter count="3"> <div><Icon name="check-circle" size="16" color="#28a745" /> <strong>Build passed</strong> — 5 min ago</div> <div><Icon name="user-plus" size="16" color="#17a2b8" /> <strong>New user registered</strong> — 20 min ago</div> <div><Icon name="alert-triangle" size="16" color="#ffc107" /> <strong>High CPU usage</strong> — 1 hour ago</div></NotificationCenter>

Props

PropTypeDefaultDescription
counttext"0"Badge count (hidden when "0")
childrencontent-Notification items (each in a div)