Loading the library…
Every preview below is the real component, running. Open one to change the viewport, switch themes and read the source.
Navigation / Refined
A table of contents that tracks the section in view: a marker slides to the active heading and clicks scroll smoothly.
Forms / Refined
A date-of-birth input as three typed fields (day, month, year) that auto-advance, validate the real date and show age.
Forms / Refined
A lock screen PIN pad: dots fill as you tap, a wrong code shakes and counts tries, three misses lock it for a while.
Components / Refined
An emoji picker with search, category tabs, a recents row that learns, arrow-key grid navigation and a name preview.
Navigation / Refined
A mobile tab bar with a sliding indicator, badges that clear on visit, a centre create button and tap-again-to-top.
Data / Refined
A code diff with unified and split views, +/− counts, collapsed unchanged lines you can expand, and per-line comments.
Components / Refined
Crop an image: drag the frame, pull a corner to resize, lock an aspect ratio, zoom, and read the exact output size.
Components / Refined
Two resizable panes: a draggable divider that snaps a pane closed, remembers its size and resets on double-click.
Forms / Refined
A Write/Preview markdown box with a format toolbar, keyboard shortcuts, list continuation and a live word count.
Components / Refined
A to-do list: add with Enter, check off with a strike, filter All / Active / Done, clear completed, and undo a delete.
Components / Refined
A schematic map with numbered pins and a synced list: pick a pin or a row, filter open-now, and see distance and hours.
Forms / Refined
A Wi-Fi picker: signal bars, lock icons, a password prompt that expands in place, connecting state and forget network.
Components / Refined
A photo grid with selection mode: tap to pick, Shift-click a range, drag across tiles, then act on the selection.
Components / Refined
An approval request: details at a glance, Approve or Reject with an optional note, a resolved state and an undo window.
Components / Refined
Signed-in devices with place and last active: this one is pinned, revoke others with a confirm or all at once.
Forms / Refined
Editable invoice lines: add rows, edit quantity and rate inline, remove lines, and watch discount, tax and total update.
Components / Refined
Trim a clip: drag the in and out handles over a frame strip, scrub the playhead, and read the new duration as you go.
Components / Refined
A month view with event dots per day: pick a day to list its events below, jump months, and add a quick event.
Components / Refined
A searchable FAQ: matches highlight in questions and answers, topics filter the list, and answers open in place.
Forms / Refined
Set up an authenticator app in three steps: scan a code or copy the key, confirm a 6-digit code, then save backup codes.
Data / Refined
A live departure board: minutes count down, due trains blink once and leave, lines filter, and a stop can be starred.
Data / Refined
A forecast card: scrub the hourly temperature line to read any hour, or switch to a 7-day list with high/low range bars.
Data / Refined
A stock watchlist with sparklines: sort by name, price or change, toggle % and $ change, and remove with undo.
Components / Refined
A person card with quick actions: copy email or phone with feedback, see their local time, and expand for more details.