PluginBench
MCP Server
Active

Agent-Native Clips MCP Server

io.github.BuilderIO/agent-native-clips

Record and understand meetings, screens, and voice notes with AI-powered analysis.

What is the Agent-Native Clips MCP server?

Agent-Native Clips is an MCP server that enables AI agents to process screen recordings, meeting transcripts, and voice dictations with AI analysis. It integrates with the Agent-Native framework to provide agents with tools for capturing and understanding multimedia content.

Clips lets you record screens, meetings, and voice notes, then uses AI to analyze and extract insights from that content. It's useful for teams that need to capture and understand conversations, demonstrations, or work sessions without manual transcription or note-taking.

How to install Agent-Native Clips

Copy-paste configuration for popular MCP clients.

transport: http
Config generated by PluginBench — verify against the source before use.
~/.cursor/mcp.json
{
  "mcpServers": {
    "agent-native-clips": {
      "url": "https://clips.agent-native.com/mcp"
    }
  }
}

Tools & capabilities

Tools this server exposes to the agent.

  • Screen recording — Capture and record screen activity
  • Meeting notes — Process and analyze meeting transcripts and audio
  • Voice dictation — Convert voice input to text and analyze content

Use cases

  • Automatically transcribe and summarize meeting recordings
  • Extract action items and decisions from voice notes
  • Create searchable archives of screen recordings with AI-generated summaries
  • Capture and analyze product demos or training sessions
  • Generate meeting notes from voice dictation without manual transcription

Agent-Native Clips MCP server FAQ

What is Agent-Native Clips?

Clips is an open-source app built on the Agent-Native framework that records and analyzes screen activity, meetings, and voice notes using AI. It's designed to help teams capture and understand multimedia content without manual transcription.

Is Agent-Native Clips free?

Yes, Agent-Native is open-source (MIT licensed) and available at no cost. You bring your own LLM, database, and infrastructure.

How do I use this MCP server with Claude or Cursor?

Connect the remote MCP server at https://clips.agent-native.com/mcp in your Claude or Cursor configuration to give AI agents access to Clips' recording and analysis capabilities.

What authentication is required?

The README does not specify authentication requirements. Check the Agent-Native documentation or repository for details on setup and access control.

Can I self-host Agent-Native Clips?

Yes, Agent-Native is open-source. You can self-host it using PostgreSQL (or PGlite for local development) on any Nitro-compatible host.

What data does Clips process?

Clips processes screen recordings, meeting audio/transcripts, and voice dictations. All data stays in your infrastructure—you control your LLM, database, and tools.

README (reference)

Source of truth, from the repository.

<picture> <source media="(prefers-color-scheme: dark)" srcset="https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2F5476444e54ee4a958966c90caca468e3" /> <source media="(prefers-color-scheme: light)" srcset="https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2F7628600bc10a4940b78f42c5df7628b0" /> <img alt="Agent-Native: The agentic application framework" src="https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2F7628600bc10a4940b78f42c5df7628b0" /> </picture>

Agent-Native

Agent-Native is an open-source TypeScript framework for building agents that pair autonomous work with a purpose-built UI. Define each capability once as an action: the agent uses it as a tool, and the UI calls it from code.

Quick start

npx --yes @agent-native/core@latest create my-agent --standalone --template chat

Follow the getting started guide for a full intro to the framework.

Why build agents with UIs?

Coding agents work with more than a text box. Their environment provides context, tools, files, tests, and previews that make their capabilities and results visible.

Knowledge work needs that same kind of environment. A UI shows what an agent can do and gives people familiar ways to inspect, edit, approve, and share its work.

How Agent-Native works

  • Shared actions. The agent calls each capability as a tool, and the UI calls it from code. Both paths use the same validation, permissions, and implementation.
  • Shared data. Work done by the agent appears in the UI, and work done in the UI is available to the agent.
  • Shared application state. The agent receives relevant UI state, such as the current page, selected record, or active view.

The agent does not click through the UI. It works through the same action layer as the UI.

Example: a shared action

Create actions/hello.ts:

import { defineAction } from "@agent-native/core/action";
import { z } from "zod";

// One action powers every app surface: UI, agent, HTTP, MCP, A2A, and CLI.
export default defineAction({
  description: "Return a friendly greeting.",
  schema: z.object({
    name: z.string().default("world").describe("Name to greet"),
  }),
  http: { method: "GET" },
  run: async ({ name }) => {
    return { message: `Hello, ${name}!` };
  },
});

The agent receives hello as a tool. React calls the same function with useActionQuery("hello", { name: "Alex" }). Agent-Native also exposes it through HTTP, MCP, A2A, and the CLI.

Included

  • Agent chat: Let people delegate work, ask questions, and review results in the same UI.
  • Authentication and permissions: Control who can access and change shared work.
  • Skills and memory: Give agents reusable expertise and persistent context.
  • Automations: Run agent work on schedules or events.
  • Agent teams: Delegate work to specialist agents in the same workspace or across connected agents.
  • PostgreSQL backend: Use PostgreSQL in production and PGlite for local development on any Nitro-compatible host.

Example: edit a running app visually

Use /visual-edit in Claude Code to edit a running app on a canvas instead of prompting for each small UI nudge. Compare live pages together, then ask Claude to apply the chosen edits to your source. For example:

/visual-edit the onboarding flow, plus home at every breakpoint

Review the onboarding screens alongside Home at desktop, tablet, and mobile sizes, adjust a button's color or spacing directly, then ask Claude to apply the pending edits to your source. See the Visual Edit guide for the full walkthrough and sharing details.

Bring your LLM, SQL database, tools, and infrastructure. Everything you build stays yours.

See Agent-Native in action:

https://github.com/user-attachments/assets/ef51644b-6506-46d8-8083-0af7b7e5b65c

<br />

Open-source agents

Start from one of these agents or use it as an example for your own.

<br /> <table> <tr> <td width="33%" align="center" valign="top"> <br />

Clips

<a href="https://agent-native.com/apps/clips/"> <picture> <source media="(prefers-color-scheme: dark)" srcset="https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2F4dc9c87b9a224132855e1cb68cd89f9e?format=webp&width=800"> <img src="https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2F462fdb643d5d403a8c54540c5c3292f6?format=webp&width=800" alt="Clips app screenshot" width="100%"> </picture> </a>

Record and understand meetings, screens, and voice notes.

<br /> </td> <td width="33%" align="center" valign="top"> <br />

Design

<a href="https://agent-native.com/apps/design/"> <picture> <source media="(prefers-color-scheme: dark)" srcset="https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2F072f66a3e360464fb48617670ceee46f?format=webp&width=800"> <img src="https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2Fc9f693f170294bde8ebc733cff368af9?format=webp&width=800" alt="Design app screenshot" width="100%"> </picture> </a>

Generate and refine interactive designs.

<br /> </td> <td width="33%" align="center" valign="top"> <br />

Slides

<a href="https://agent-native.com/apps/slides/"> <picture> <source media="(prefers-color-scheme: dark)" srcset="https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2F710f5b7586cc41deaa0e6f8de658a499?format=webp&width=800"> <img src="https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2F6223a64717a04931a6f509696019f48b?format=webp&width=800" alt="Slides app screenshot" width="100%"> </picture> </a>

Create and edit on-brand presentations.

<br /> </td> </tr> <tr> <td width="33%" align="center" valign="top"> <br />

Analytics

<a href="https://agent-native.com/apps/analytics/"> <picture> <source media="(prefers-color-scheme: dark)" srcset="https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2Fba632b39758d448594f7e5d2403e5d0f?format=webp&width=800"> <img src="https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2F976ea93771b64b9e8c1b3eb12e606e07?format=webp&width=800" alt="Analytics app screenshot" width="100%"> </picture> </a>

Ask questions of your data and build dashboards.

<br /> </td> <td width="33%" align="center" valign="top"> <br />

Calendar

<a href="https://agent-native.com/apps/calendar/"> <picture> <source media="(prefers-color-scheme: dark)" srcset="https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2F91d4c18d256b49e6bca24c23ce90a4f2?format=webp&width=800"> <img src="https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2F8d9d48bb2f1d498f9601ac28c64edd4c?format=webp&width=800" alt="Calendar app screenshot" width="100%"> </picture> </a>

Find time, schedule events, and manage bookings.

<br /> </td> <td width="33%" align="center" valign="top"> <br />

Mail

<a href="https://agent-native.com/apps/mail/"> <picture> <source media="(prefers-color-scheme: dark)" srcset="https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2F216aaef9859144ffa3eb9498fa1132da?format=webp&width=800"> <img src="https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2F064aee3ec5cd44879b9c186f63a6d6f4?format=webp&width=800" alt="Mail app screenshot" width="100%"> </picture> </a>

Prioritize email, draft replies, and follow up.

<br /> </td> </tr> <tr> <td width="33%" align="center" valign="top"> <br />

Assets

<a href="https://agent-native.com/apps/assets/"> <picture> <source media="(prefers-color-scheme: dark)" srcset="https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2Fde445dd867744e9bac5d3e5d04c903b2?format=webp&width=800"> <img src="https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2Fac5701f0871f4edbb06fa9cdb12b166e?format=webp&width=800" alt="Assets app screenshot" width="100%"> </picture> </a>

Create and organize on-brand media.

<br /> </td> <td width="33%" align="center" valign="top"> <br />

Content

<a href="https://agent-native.com/apps/content/"> <picture> <source media="(prefers-color-scheme: dark)" srcset="https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2Fa9f30380b03b4fd1a7d2ab371ddfd798?format=webp&width=800"> <img src="https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2F979f792c79834470a513a9d9b733dd84?format=webp&width=800" alt="Content app screenshot" width="100%"> </picture> </a>

Draft, organize, and publish content.

<br /> </td> <td width="33%" align="center" valign="top"> <br />

Plans

<a href="https://agent-native.com/apps/plan/"> <picture> <source media="(prefers-color-scheme: dark)" srcset="https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2Fe89439e917044fc9ac9663737e35bf1f?format=webp&width=800"> <img src="https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2F98427229c8c84c30afee56172503c294?format=webp&width=800" alt="Plans app screenshot" width="100%"> </picture> </a>

Create and review visual plans with diagrams, wireframes, and prototypes.

<br /> </td> </tr> </table>

Explore the full app gallery, or start with the framework guide.

Documentation and community

Contributing

Working on this repository itself? See DEVELOPMENT.md for local setup, workspace structure, and guard scripts.

License

MIT

Related MCP servers

Open-source TypeScript framework for building agents with purpose-built UIs and shared actions.

7.0k
TypeScript
View repository →

Agent-Native design tool for creating and editing visual designs with AI assistance

7.0k
TypeScript
View repository →

Central Slack/Telegram router for agent jobs, memory, approvals, and agent-to-agent delegation

7.0k
TypeScript
View repository →

Agent-Native form builder—create, edit, and manage forms with AI agents and shared UI actions.

7.0k
TypeScript
View repository →

AI-powered email client with keyboard shortcuts and intelligent message triage

7.0k
TypeScript
View repository →

Create structured visual plans and PR recaps with diagrams, prototypes, and annotations powered by Agent-Native.

7.0k
TypeScript
View repository →