Skip to content
Seamless UI
Seamless UI

Animated components for modern apps and AI agents.

Preview a component, add its source to your Next.js or Vite + React project with one command, and make it yours.

npx @seamlessui/cli add tool-call-card

Pre-release@seamlessui/cli is not on npm yet. Install from a local build.

Browse componentsInstallation guide

Tool Call Card · live demo

Simulated with local fixture data

Agent run · Ready to run

  1. search_docs

    Queued

    Search the docs for “rate limits”

    Input
    {
  "query": "rate limits",
  "limit": 5
}

  2. fetch_page

    Queued

    Read /docs/api/rate-limits

    Input
    {
  "path": "/docs/api/rate-limits"
}

  3. summarize

    Queued

    Summarize the limits for the answer

    Input
    {
  "maxWords": 60
}

Start with the essentials

Everyday building blocks and agent states: 29 components, plus an installable Agent Workspace.

Agent WorkspaceAll 29 components

From preview to your repo

  1. 1

    Preview

    Try every state live, in light and dark, before you install anything.

  2. 2

    Plan, then add

    One command shows the files and packages it will add, then writes them. Run it with --dry-run to stop at the plan.

  3. 3

    Own the source

    Components land in components/seamless as plain TypeScript and Tailwind. Edit them freely; reinstalls never overwrite your changes.

$ seamless add tool-call-card --dry-run

Items
  badge@0.2.0             required by tool-call-card
  tool-call-card@0.2.0

Files
  add       src/components/seamless/ui/badge.tsx
  add       src/components/seamless/agent/tool-call-card.tsx

npm dependencies
  none

Dry run: would add 2 files. Nothing was written.