11 Blocks

shadcn/ui announcement bar blocks & components.

Announcement bars and product-update callouts for shadcn/ui: dismissible top bars (with localStorage persistence), sale countdowns, What's New carousels, usage-quota meters, and live integration-status cards. Small blocks that carry one message and stay out of the way.

Dismissible Bar And Callout

Announcement 1Free

Dismissible top announcement bar above a centered release callout card with a What's New badge, headline, and two call-to-action buttons.

BadgeButton

Product Update Card

Announcement 2Free

Product update announcement card with a New badge and version label, feature headline, supporting detail, release date, and a link button.

BadgeButtonCard

Persisted Dismissible Banner

Announcement 3Free

Single-line announcement banner that remembers its dismissal in localStorage over a page placeholder, with a link to show it again.

Button

Sale Countdown Promo Bar

Announcement 4Free

Sticky promo announcement bar with a live sale countdown ticking days, hours, minutes, and seconds beside a shop the sale button.

Button

What's New Carousel

Announcement 5Pro

Product update carousel with What's New, Tips, and Updates tabs that auto-advance, pairing a mock preview with a headline, dot pagination, and progress bar.

Tabs
motion

Usage Quota Meter Banner

Announcement 6Pro

Usage quota announcement banner where the API request count animates up and the meter fills on scroll, with a reset date and Upgrade Plan button.

ButtonProgress
motion

Integration Status Card

Announcement 7Pro

Integration status announcement listing Slack, Vercel, Supabase, and Linear with pulsing status dots, a degraded service note, and a logs link.

Badge
motion

Self Typing Install Command

Announcement 8Pro

Install command announcement where a shadcn CLI command types itself into a dark terminal, with click-to-copy confirmation inside a collapsible section.

AccordionButton
motion

Scheduled Maintenance Poster

Announcement 9Pro

Scheduled maintenance announcement on a dark island with corner brackets, a shimmer sweep, the downtime window detail, and a View Status Page button.

Button
motion

Choose A Path Split

Announcement 10Pro

Two-track announcement split pairing a dark intent panel with an explainer offering two hover-animated arrow links, browse blocks or open the theme editor.

motion

Edge Network Partner Split

Announcement 11Pro

Partner announcement split with an animated logo network map beside a partner badge, headline, count-up stats, and a View Integration button.

Button
motion