Notification Stack

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

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

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

Import & use
import { Notification10 } from "@/components/beste/piece/notification10";

<Notification10
  items={[
    {
      "icon": "heart",
      "title": "3 new likes",
      "description": "on your post about shipping velocity"
    },
    {
      "icon": "message",
      "title": "Alex replied",
      "description": "in the #launch-prep thread"
    },
    {
      "icon": "bell",
      "title": "Daily standup",
      "description": "starts in 10 minutes"
    }
  ]}
/>

More Notification pieces

View all Notification
Weekly product syncToday, 14:00 – 14:30
in 10 min
Google Meet6

Calendar Reminder

notification12

Upcoming-meeting card with a starts-soon pill, video location, and attendee count.

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.

@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.

Out for deliveryArrives today before 18:00
DHL Express1Z999AA10123456784

Shipping Update

notification13

Delivery progress card with a four-step tracker, carrier line, and ETA string.

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.

Stripereceipts@stripe.com
09:42
Your February invoice is readyYour usage for February 1 – 29 totalled $1,284.00. Payment will be collected on the 3rd.

Email Preview

notification11

Inbox row with sender, subject line, two-line body preview, attachment clip, and star.