Pieces/Form(35)

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.

Friendly
FormalNeutralFriendlyPlayful

Labeled-tick slider with a primary fill, a value pill in the header, and the active tick bolded.

Violet · #6D5EFA

Row of round color swatches where the selected one picks up an outer contrast ring.

USD · US Dollar

Open-state select showing the focused control and the flyout list with one option muted as chosen.

Saved
Beste Sözen
Auto-saves as you type.Saved just now

Inline field with an autosave status pill that shifts between saved, saving, and unsaved dot colors.

Start typing to search
Beste Sözen
Beste SözenDesign lead
Mirko Petrov
Mirko PetrovEngineer
Noor Ahmed
Noor AhmedProduct

Searchable people picker with a focused search input above a list that tints the selected row.

16
1224

Font-size slider with discrete tick dots under the rail and a mono value chip in the header.

Mira & Co.

Click-to-edit field that toggles between a plain value with a hover pencil and an input flanked by save and cancel buttons.

sk_•••••••••••••••••••••••••••••••••••••••••••3456

Read-only value with an optional mask toggle and a copy button that flips to an emerald Copied state on click.

Legal consent card with a custom checkbox, inline underlined policy links, and a red asterisk when required.

Get early access

you@clinic.com
Notify me

No spam, just one launch note.

A compact signup card with a title, an email field, an accent submit button, and a small reassurance note.

Notifications

New bookings
Payment received
Weekly summary

A compact settings card listing labeled rows, each with an accent on/off toggle switch.