# Connect ElevenLabs

> Connect an ElevenLabs API key with text-to-speech access, add narration and verify audio playback in your mobile app.

Canonical: https://www.rnblocks.dev/docs/connectors/elevenlabs
Updated: 2026-10-01

Turn text into spoken narration. Begin with a short passage so you can check the connection, voice and playback controls on a phone.

## Before you start

- An app in Studio.
- An ElevenLabs account with a usable API key, text-to-speech access and sufficient provider quota.
- A voice your ElevenLabs account is permitted to use.

## Create a key with voice access

Section: https://www.rnblocks.dev/docs/connectors/elevenlabs#key

1. **Open API Keys in ElevenLabs** — Sign in and go to **Developers → API Keys**, following [ElevenLabs’ setup guide](https://help.elevenlabs.io/hc/en-us/articles/14599447207697-How-do-I-authorize-myself-using-an-API-key).

2. **Allow the feature you need** — Create a key and enable the text-to-speech access required by your app. Review its credit quota and expiration if configured. Keep restrictions appropriate to the feature rather than enabling unrelated account access.

3. **Copy the value privately** — Copy the full key when ElevenLabs shows it. The name or final characters displayed later are not a replacement for the complete credential.


## Connect ElevenLabs to this app

Section: https://www.rnblocks.dev/docs/connectors/elevenlabs#connect

1. **Open the app in Studio** — Select **App options (+) → Connectors → ElevenLabs**. A **Connect ElevenLabs** request in the conversation opens the same setup. Connections belong to the app you have open.

2. **Save the credential privately** — Paste your credential into **API Key** and select **Save**. Keep it out of the conversation and app source. RNBlocks stores the credential for this app; the saved value is masked in this form.

3. **Return to your conversation** — Close the connection panel and continue the feature you requested. **Connected** means a credential is saved; the feature still needs a successful request and a test in your app.

### Figure: Connect ElevenLabs, step by step

App options (+) opens Connectors. Choose ElevenLabs, enter its API Key privately and select Save. The saved view masks the value and shows Connected.

1. **App options** — The actual App options menu above the + button. It contains separate Supabase, Connectors and App memory actions.

2. **Choose a service** — The Connectors catalogue contains OpenAI, Anthropic, Groq, ElevenLabs and Replicate cards with their own logos.

3. **Add your key** — ElevenLabs connector detail with its original logo, use cases, documentation link, private API Key field and Save button. The field is empty.

4. **Saved connection** — Illustrative saved ElevenLabs connection. Connected appears beside its name, the saved value is masked, and Update and Disconnect controls are available. No credential is shown.

1. Open App options (+) → Connectors in the app you want to connect.
2. Choose ElevenLabs in the catalogue, then enter your API Key in its private form and select Save.
3. Return to the conversation and test the feature. Connected means a credential is saved, not that a provider request has succeeded.

The actual connection screens. Empty form and illustrative saved state; no credential is shown.


## Hear it on a phone

Section: https://www.rnblocks.dev/docs/connectors/elevenlabs#test

For example: “Read each story aloud using ElevenLabs. Add Play and Pause controls, show when narration is being prepared and stop the current audio before playing another story.”

- Generate narration for a short paragraph in the iOS or Android preview.
- Check the selected voice, pronunciation, volume and Play/Pause behavior.
- Move between screens and start another narration. Confirm that two clips do not play over each other.
- If the app promises a saved audio library, reopen it and confirm the files remain playable. Text-to-speech alone does not establish persistent storage.


## If the app stays silent

Section: https://www.rnblocks.dev/docs/connectors/elevenlabs#recovery

| What happened | What to check |
| --- | --- |
| The request is rejected | Check key expiration, text-to-speech permissions, provider quota and access to the chosen voice. |
| Audio was generated but cannot be heard | Check phone volume and playback controls, then tell Studio which device and action failed. |
| Only long passages fail | Start with a short passage and ask Studio to inspect the selected model’s input limits and request size. |

- [ElevenLabs API key restrictions](https://elevenlabs.io/docs/overview/administration/workspaces/api-keys)

## Costs and the information your app sends

Section: https://www.rnblocks.dev/docs/connectors/elevenlabs#costs-and-data

Your connected provider handles its own API usage and billing. Those charges are separate from RNBlocks credits used while building your app. Review the provider’s quota and billing before testing with a large audience.

An AI feature sends the information needed for that request to its provider. Decide what your app should send, explain that clearly to your users, and test any permission and decline choices before release. Connecting a service does not automatically add a saved history, private file library or every feature in that provider’s API.

- [Understand credits and usage](https://www.rnblocks.dev/docs/credits-and-usage)

## Update or disconnect

Section: https://www.rnblocks.dev/docs/connectors/elevenlabs#manage

Open **App options (+) → Connectors → ElevenLabs**. To replace the saved credential, enter the new value and select **Update**, then test the feature again.

**Disconnect** removes this app’s saved ElevenLabs credential. Features that use it will need a working connection again. It does not close your provider account, cancel provider billing, revoke the original key at the provider, or erase data already sent there. Reopen Connectors to check the saved connection state.


## Continue

- [Connector overview](https://www.rnblocks.dev/docs/connectors)
- [Write stories with Claude](https://www.rnblocks.dev/docs/connectors/anthropic)
- [Preview and test](https://www.rnblocks.dev/docs/previewing-screens)

## Official references

- [ElevenLabs API key setup](https://help.elevenlabs.io/hc/en-us/articles/14599447207697-How-do-I-authorize-myself-using-an-API-key)
- [ElevenLabs API key restrictions](https://elevenlabs.io/docs/overview/administration/workspaces/api-keys)
