13 Blocks

shadcn/ui notification blocks & components.

Notification UI for shadcn/ui: bell-trigger dropdowns with unread badges, tabbed notification centers, preference matrices, actionable feeds with inline approve/decline, time-grouped inboxes, a Do-Not-Disturb panel with snooze, and live activity streams. Every common notification surface, from popover to full inbox.

Notifications Sheet Panel

Notifications 1Free

Notifications sheet opened from a bell trigger, with icon tiles, unread highlighting, timestamps, an unread count, and a mark all read action.

ButtonScroll AreaSeparatorSheet

Bell Popover With Badge

Notifications 2Free

Notification bell button carrying an unread count badge that opens a compact popover of avatar rows, mark all read, and a view all link.

AvatarBadgeButtonPopoverScroll AreaSeparator

Notification Center Tabs

Notifications 3Free

Notification center card with All, Unread, and Mentions tabs, per-row read toggling, a mark all read action, and a caught up empty state.

AvatarBadgeButtonCardScroll AreaSeparatorTabs

Notification Preferences Toggles

Notifications 4Free

Notification preferences panel with a row per activity type and separate email and push toggle switches for each.

CardSeparatorSwitch

Dismissible Alert Stack

Notifications 5Free

Stack of dismissible inline notification alerts in success, info, warning, and error variants, resolving to an all caught up empty state.

Live Notification Center Sheet

Notifications 6Pro

Live notification center sheet where rows stagger in, a new notification slides in on an interval, the unread count climbs, and tabs filter the list.

AvatarButtonScroll AreaSeparatorSheetTabs

Actionable Task Notifications

Notifications 7Pro

Notification popover of task rows with inline Approve, Decline, and Review buttons that resolve in place, plus dismiss and All, Tasks, Updates tabs.

AvatarButtonPopoverScroll AreaSeparatorTabs

Time Grouped Notification Inbox

Notifications 8Pro

Notification inbox popover grouped under sticky Today, Yesterday, and Earlier headers, with condensed avatar rows, per-section clear, and an overflow count.

AvatarBadgeButtonPopoverScroll Area

Expandable Team Update Threads

Notifications 9Pro

Team updates notification sheet where rows expand into quoted context with an inline reply input, presence dots on avatars, and an All or Mentions tab.

AvatarBadgeButtonCollapsibleInputScroll AreaSeparatorSheetTabs

Build And Deploy Feed

Notifications 10Pro

Build pipeline notification popover with a live in-progress deploy (ticking progress, elapsed timer), status dots, brand marks, and a retry action.

ButtonPopoverProgressScroll AreaSeparatorSpinner

Do Not Disturb Controls

Notifications 11Pro

Notification popover with a Do Not Disturb switch that pauses the list, a channel toggle group that mutes categories, and per-row snooze.

AvatarButtonPopoverScroll AreaSeparatorSwitchToggle Group

Bulk Select Notification Inbox

Notifications 12Pro

Full notification inbox with an All, Unread, Mentions, System filter rail, time-grouped rows, bulk-select checkboxes, and a floating mark read or archive bar.

AvatarBadgeButtonCheckboxSeparatorTabs

Realtime Activity Stream

Notifications 13Pro

Live notification stream where events continuously arrive at the top with a pulsing live indicator and typing indicator, pausing on hover and off-screen.

AvatarBadgeSeparator