Back to Skills

elevenlabs-agents

Build conversational AI voice agents on the ElevenLabs platform. Configure agent + tools + knowledge base, integrate SDK (React / React Native / Swift / JS / server-side), test, deploy. Use whenever the user mentions ElevenLabs, building a voice agent, an AI phone system, an AI receptionist, conversational AI, or troubleshooting deprecated @11labs packages, webhook errors, CSP violations, localhost allowlist, or tool parsing errors.

968stars102forksUpdated 8/16/2026

Security Assessment

Safe(95/100)
Security Score95/100

About elevenlabs-agents

elevenlabs-agents is a build guide for creating production-ready conversational AI voice agents on the ElevenLabs platform. It walks through the full lifecycle: creating an agent via the dashboard or the 'Agents as Code' CLI, writing an effective system prompt with a six-component framework (personality, environment, tone, goal, guardrails, tools), adding client- and server-side tools, wiring up a knowledge base, integrating the SDK, and testing and deploying. It solves the problem of scattered, fast-moving ElevenLabs guidance by consolidating the correct current packages and patterns in one place.

The skill is explicit about the modern SDK surface — @elevenlabs/react, @elevenlabs/client, @elevenlabs/react-native, @elevenlabs/elevenlabs-js, and the agents CLI — and flags the deprecated @11labs/* packages that should be uninstalled. It carries ready-to-use assets including React and JavaScript SDK boilerplate, a widget embed template, a system-prompt template, a simulation template, and a CI/CD example, plus reference workflow examples. It also targets common failure modes named in its description: webhook errors, CSP violations, localhost allowlist issues, and tool parsing errors.

It is aimed at web and mobile developers building voice agents, AI phone systems, AI receptionists, or other conversational AI experiences on ElevenLabs, across React, React Native, Swift, browser JavaScript, and server-side environments. Note that the skill is marked claude-code-only in its front matter.

FAQ

Which packages should I use, and which are deprecated?

Use @elevenlabs/react for React, @elevenlabs/client for browser/JS, @elevenlabs/react-native for mobile, @elevenlabs/elevenlabs-js for the full server-side API, and the @elevenlabs/agents-cli for Agents as Code. The old @11labs/react and @11labs/client packages are deprecated and should be uninstalled.

Can I use the full JS SDK in the browser?

No. @elevenlabs/elevenlabs-js relies on Node.js child_process and will not work in browsers. Use @elevenlabs/client for browser environments, or put the full SDK behind a proxy server.

How should I structure the agent's system prompt?

The skill provides a six-component framework: personality, environment, tone, goal, guardrails, and tools — each with a fill-in template — so the agent has a defined identity, context, style, objectives, boundaries, and tool-use rules.

What common problems does it help troubleshoot?

It targets deprecated @11labs packages, webhook errors, CSP violations, localhost allowlist issues, and tool parsing errors.

Is this skill usable outside Claude Code?

Its front matter marks it as claude-code-only, so it is intended for the Claude Code environment.

All Files

13 files
assets/javascript-sdk-boilerplate.js4.8 KB
View
assets/simulation-template.json0.3 KB
View
assets/widget-embed-template.html2.0 KB
View
references/workflow-examples.md3.5 KB
View
assets/ci-cd-example.yml2.0 KB
View
assets/react-sdk-boilerplate.tsx4.8 KB
View
assets/system-prompt-template.md4.7 KB
View
references/compliance-guide.md3.9 KB
View
assets/agent-config-schema.json2.5 KB
View
assets/react-native-boilerplate.tsx2.1 KB
View
assets/swift-sdk-boilerplate.swift2.1 KB
View
references/api-reference.md6.6 KB
View
SKILL.md13.1 KB
View

Install elevenlabs-agents

Download and extract the skill files to your .claude/skills/ directory.

Quick Setup:

  1. Copy the skill folder to .claude/skills/
  2. Claude will automatically detect and use the skill