Accessible React components with an AI agent UI kit (prompt input, reasoning, tool calls, plans with approval, citations, traces), GSAP motion and live theming.
Stacked disclosure sections with numbered, dashed and separated styles.
A single-open FAQ with mono index numbers.
Card-like items, and dashed rules between items.
Callouts with a colored rail, tone icons and fold-away dismiss.
Confirmation dialogs for destructive or irreversible actions.
A destructive confirmation.
Info, success (dismissible), warning and destructive.
Any icon, animated with a motion that fits it: bells ring, arrows nudge, gears turn.
Ten icons, each with its own animation.
A live feed where items arrive and push the rest down.
Payments, members, merges and comments.
Something the agent made, in its own panel with actions.
A generated document.
Keep media at a fixed ratio so layout never shifts.
A responsive frame.
Paper with violet, editorial type, generous corners. Light and dark mode. Font: Instrument Sans.
Avatars with tinted initials, presence dots and fanning groups.
Presence dots and a group of seven.
Compact status and category labels with status dots and a mono style.
Status dots, a live pulse, mono tags and a badge link.
Seven tones from neutral to solid.
A light that travels around a card's border.
A pricing card with a beam.
Flip between regenerated versions of a reply.
Three versions of a reply.
Breadcrumb trails with mono slash separators and an ellipsis.
A trail with an ellipsis for skipped levels.
Confetti that sprays from any button on click.
Click for confetti.
Tactile buttons with loading state, keyboard hints and six variants.
Join buttons into one control: split buttons, toolbars, steppers.
Outline group, split publish button, prev/next.
Keyboard hints, the loading state, icon buttons and every size.
Primary, secondary, outline, ghost, destructive and link.
Surfaces with crop marks, raised and inset styles, and a divided footer tray.
Outline, raised and inset cards whose whole surface is a link.
Raised card with crop marks, a label, an action and a footer tray.
The steps an agent took, on a rail with live status.
Four steps with search results.
Checkboxes with a self-drawing check mark and an indeterminate state.
A parent checkbox that turns indeterminate.
Labels, descriptions and the disabled state.
A restore point in a conversation.
A labelled checkpoint.
Warm paper, clay buttons, generous corners. Light and dark mode. Font: Instrument Sans. Claude's interface uses a commercial face; Instrument Sans is the closest open alternative.
Code in a reply: filename, line numbers, highlights, wrap and copy.
Two highlighted lines.
Show and hide a region with a measured height animation.