Bell Badge

Bell icon with a pinging count badge that caps at 99+ and sits in a rounded pill.

12
Notifications

Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.

Import & use
import { Notification17 } from "@/components/beste/piece/notification17";

<Notification17
  count={12}
  label="Notifications"
  pinging={true}
  tone="rose"
/>

More Notification pieces

View all Notification

Activity

Rowan Blake confirmed

Intake · 09:00

2m

Invoice #4821 paid

$1,240 · Card

18m

Renewal due soon

3 members this week

1h

Activity Feed Card

notification18

A stacked activity feed where each row carries a tinted icon chip, a title and meta line, and a relative timestamp.

3 new likeson your post about shipping velocity
Alex repliedin the #launch-prep thread
Daily standupstarts in 10 minutes

Notification Stack

notification10

Grouped inbox card showing three queued notifications behind two peeking cards above.

AnnouncementBeste v3 is now in open beta
Early access to the new editor, theming, and live previews.

Announcement Banner

notification16

Full-width tinted banner with a tag pill, headline, CTA button, and a dismiss control.

Elena Park
Elena Park2m
Just pushed the redesign. Take a look when you have a sec 🙌

Message Preview

notification4

Chat notification showing sender avatar, message snippet, timestamp, and an unread dot.

@maya.dev mentioned you in #design-reviewCan you take a look at the new pricing layout when you're free?5m ago

Mention Alert

notification5

You-were-mentioned card with the channel context and the quoted message.

Linear
Linearnow
New issue assignedENG-482 · Crash on checkout submit

Push Notification

notification3

Mobile-style push toast with app icon tile, timestamp, and a two-line preview.