Accessible React components with an AI agent UI kit (prompt input, reasoning, tool calls, plans with approval, citations, traces), GSAP motion and live theming.
A headline accent and a line you light with the pointer.
Press-and-hold button for destructive actions, with a timed fill.
Hold to delete; release early to cancel.
Preview cards for links and mentions, opened on hover.
A mention that previews a profile.
Numbered citations inside a sentence, with a preview on hover.
Two citations in a paragraph.
Recessed text inputs with leading and trailing add-ons.
Icons, a URL prefix, a keyboard hint, invalid and disabled.
A label, an input and a helper text wired with aria-describedby.
One-time-code input with slots that spring as digits land.
Two groups of three with a separator.
A flexible row: media, title, description and actions.
With a switch, and as a link.
Keycaps and key combinations.
Single keys and combinations.
Accessible form labels with required and optional markers.
Markers for required and optional fields.
Hairline borders, quiet greys, one indigo accent. The default. Light and dark mode. Font: Inter, the face Linear uses, at weights 510 and 590.
Magnetic hover: elements lean toward the cursor and spring back.
A primary button and an icon button.
Seamless infinite scrolling loop that eases to a stop on hover.
Labels and pills in opposite directions.
One conversation turn: user bubble or assistant document, with hover actions.
A question and an answer with actions.
Pick the model: grouped by provider, searchable, with context and tags.
Five models across three providers.
Pure neutral, ink accents, Geist. Quiet and exact. Light and dark mode. Font: Geist.
A styled native select: platform pickers, autofill, zero JavaScript.
A labelled native select.
Warm ink on white, Notion blue, calm and readable. Light and dark mode. Font: IBM Plex Sans. Notion uses the system UI face; Plex keeps the same calm, readable feel everywhere.
Numeric stepper with hold-to-repeat, keyboard steps and locale formatting.
A bounded integer and a currency amount.
Odometer-style animated counter with Intl formatting.
Currency, decimal and integer counters.
Icons orbiting a center on dashed tracks.
Two rings in opposite directions.
Crawlable pagination links with a page-range helper.
Twenty pages, siblings and ellipses.
Warm paper, ink buttons and a chartreuse signal. Light and dark mode. Font: Inter.
Password field with show/hide and a live strength meter.
Type to see the meter and checklist.
A plan an agent asks to run, with approve, reject and auto-run countdown.
Six steps with an 8-second auto-run.
Anchored panels that spring open, with optional crop marks.
A small form with crop marks.
Progress bars: eased, segmented and indeterminate.
All three styles driven by one value.