Pieces942

Compact, self-contained widgets that behave like assets. Drop them into any block, card, or page to add a small touch of polish without rewriting the surrounding UI.

Update availablev2.14.0
Restart to install new editor shortcuts and bug fixes.

Update Prompt

notification9

Software update card with version chip, changelog blurb, and a later or install action row.

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.

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.

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.

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.

Priya Shah
Priya Shahreplied to your comment
8m
Love the new onboarding flow! Quick q — does the skip button persist across sessions?

Comment Reply

notification14

Reply-to-your-comment notification with quoted text, like count, and an inline reply action.

Uploading64%
product-hero-final.mp4

Upload Toast

notification15

Live progress card with spinner, percent, filename, and a cancel × at the end of the row.

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.

12
Notifications

Bell Badge

notification17

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

Account
Plan
3
Payment
4
Done

Timeline Steps

progress1

Numbered step dots connected by a line. Completed steps fill emerald with a check.

72%

Progress Ring

progress2

Circular SVG ring with a centered percentage. Tone sets the stroke color.

Deployment68%

Linear Progress

progress3

Labelled progress bar with a percent readout above and a tonal fill.

Thinking

Loading Dots

progress4

Three staggered pulsing dots inside a pill, paired with an optional label.

Onboarding4 / 6

Segmented Progress

progress5

Row of N equal chunks with the first K filled in the chosen tone. Trailing fraction count.

Storage breakdown
  • Media53%
  • Docs23%
  • Cache15%
  • Other10%

Stacked Bar

progress6

Single horizontal bar divided into tinted segments by percentage, with a legend row below.

72%Hydration

Vertical Fill

progress7

Vertical tube that fills bottom-up with a gradient, paired with a percent readout and label.

78%Load

Gauge

progress8

Half-circle speedometer arc with a centered value, unit, and caption.

All setYour payment has cleared

Success Check

progress9

Emerald filled circle with a bold check inside, a soft pinging ring, and a title plus description beneath.

27Day streak
Longest: 42 days

Streak Counter

progress10

Sunset gradient card with a flame glyph beside a big day count and a longest-streak caption.

Workspace storage
64 GB of 200 GB

Storage Quota

progress11

Drive icon beside a label, a thin usage bar, and a used-of-total caption that retints as it fills.

Skeleton Loader

progress12

Card skeleton with an optional avatar placeholder and shimmer lines of varied widths.

5
68%
4
22%
3
6%
2
3%
1
1%

Rating Distribution

progress13

Five stacked rows mapping 5–1 stars to amber fill bars and the percentage for each tier.

Level 121840 / 2500 XP

XP Level Bar

progress14

Trophy tile beside a level badge and an XP fraction over a sunset gradient fill bar.

221B Riverside AvenueFor sale$1,240,000
221B Riverside AvenueIstanbul · Levent
32142 m²

Listing Card

realestate1

Property listing with a warm gradient photo, status pill, save heart, price chip, and beds/baths footer.