Pieces
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.
Gift Card
card17Vibrant gradient voucher with a denomination, brand mark, mono redemption code chip, and expiry.
Current Plan
card18Subscription status card showing plan name, amount, renewal date, a usage bar, and manage or upgrade buttons.
Credit Pack
card19One-time credit bundle card with a coin tile, bonus chip, per-credit rate, and a Top up CTA.
Designing the tooling that ships millions of components every week.
Profile Card
card20User profile card with a gradient avatar, role, location, a short bio, and a trailing social icon button.
Team Member
card21Directory row with an avatar carrying a presence dot, name, title, department, and a message button.
Shipping tiny tools for bigger teams. Runs, coffee, small synths.
Follow Card
card22Social profile card with a Follow or Following pill, a bio, follower count, and a mutuals line.
Business Card
card23Printed-feel contact card with a decorative corner orb and rows for email, phone, and website.
Org Chart
card24Mini org-chart card with a manager node branching down into three direct-report avatars.
40+ seed investments across developer tools, fintech, and health.
Advisor Card
card25Founder-or-advisor card with a primary sparkle badge, italic former-role line, and LinkedIn plus Intro buttons.
Our team went from pitching mockups to shipping prod features in the same sprint. The switch paid for itself in one quarter.
Testimonial Mini
card26Compact testimonial with a leading quote glyph, body paragraph, and an avatar byline underneath.
Speaker Card
card27Conference speaker card with an avatar and mic chip, talk title on a muted strip, and stage and time.
Developer Bio
card28Developer profile with a boxy mono avatar, github handle, stack chips, contributions, and streak flame.
Writing small notes about large systems.
Hover Profile
card29Compact social hover card with avatar, handle, short bio, and a three-column posts/following/followers strip.
Create your first project to start shipping components to every workspace.
Empty State
card30Dashed empty-state panel with an inbox tile, headline, supporting copy, and a dark CTA button.
Bar Chart Card
chart1Card with a label, headline value, and a row of vertical bars scaled to the data.
Donut Chart
chart2Thick donut ring with a centered percent, paired with an uppercase caption on the side.
Comparison Bar
chart3Two horizontal bars comparing this period against the previous one.
- Direct48%
- Referral24%
- Social18%
- Search10%
Pie Chart
chart4Flat-fill pie beside a legend. Each slice picks a tone from a fixed six-color palette.
Area Chart
chart5SVG line with a soft gradient fill beneath. Tone colors the stroke and fade.
Message Bubble
chat1Chat bubble with an avatar and timestamp. Role flips alignment and color.
Typing Indicator
chat2Chat bubble with three staggered dots. Signals that the other side is typing.
Group Header
chat3Chat header with a 3-avatar stack, group title, member count, and voice / video call buttons.
- Packer's Coffee6
- Sushi place3
- Stay in, order pizza9
Poll Message
chat4Chat bubble with a question and voting options. Each row fills proportionally to its vote count.
Reaction Bubble
chat5Message bubble with a small floating reaction chip tucked into the bottom corner.