# ElevenLabs NextJS Starter

> Open-source Next.js boilerplate showcasing ElevenLabs audio and voice features

An official open-source starter kit and playground by ElevenLabs built on Next.js, shadcn/ui, and Tailwind CSS v4. It gives developers pre-built interfaces and backend scaffolding for integrating text-to-speech, speech-to-text, sound effects, text-to-music, and conversational AI into web applications. It serves as an easy reference implementation for building modern AI audio tools.

Website: https://github.com/elevenlabs/elevenlabs-nextjs-starter

## What it is for

- Bootstrap a voice-enabled web app using preconfigured ElevenLabs API routes
- Test Eleven V3 speech generation and voice settings in an interactive playground
- Implement speech-to-text transcription with speaker diarization and audio tagging
- Generate custom sound effects and music tracks from text prompts

## Features

- Text to Speech and Text to Dialogue powered by Eleven V3 preview models
- Speech to Text transcription using ElevenLabs models like scribe\_v1
- Text-driven sound effect generator
- Text to Music generator with composition planning support
- Conversational AI interface setup
- Pre-styled UI components using shadcn/ui and Tailwind CSS v4
- Secure server-side API key handling using iron-session

## Pricing

Open source. Free and open source (MIT license); requires an ElevenLabs API key (usage billed by ElevenLabs)

## Details

- Type: GitHub repo
- Category: [Development](https://xiry.app/topics/development.md)
- Topic: [Boilerplates & Starters](https://xiry.app/topics/development/boilerplates-starters.md)
- Open source: yes
- Platforms: Web
- For: Next.js and React developers building voice or audio AI features
- Tags: nextjs, elevenlabs, audio, text to speech, speech to text, react, shadcn

## Why it was saved

- [@ElevenLabsDevs, 7 May 2025](https://x.com/ElevenLabsDevs/status/1920029531672371352): Ready-made codebase for shipping AI audio features quickly; uses ElevenLabs SDK (incl. V3 expressive model), Next.js + shadcn/ui, Tailwind CSS v4.

## Related

- [Starter.diy](https://xiry.app/resources/starter-diy-2164): Full-stack SaaS starter with Next.js 15, Convex, and Clerk Billing (GitHub repo, Open source)
- [AnotherWrapper](https://xiry.app/resources/anotherwrapper): Next.js AI boilerplate with pre-built apps, auth, and payments. (Web app, Paid)
- [Cult UI Pro — Polar Subscription](https://xiry.app/resources/cult-ui-pro-polar-subscription): Next.js SaaS starter template with Supabase and Polar subscription billing (Website, Open source)
- [nextjs-sessionauth-template](https://xiry.app/resources/nextjs-sessionauth-template): Next.js starter template featuring Lucia session auth and Stripe billing (GitHub repo, Open source)
- [Steven Tey's Starter Template Stack (Precedent)](https://xiry.app/resources/steven-tey-s-starter-template-stack-precedent): A full-stack Next.js tech stack for fast project prototyping and deployment. (List, Free)
- [Efferd](https://xiry.app/resources/efferd): Pre-built, responsive shadcn/ui blocks and layouts for React applications (Web app, Freemium)

Updated 10 October 2026. Page: https://xiry.app/resources/elevenlabs-nextjs-starter

Make your own library: Xiry takes your saved reels, tweets, Reddit bookmarks and Watch Later videos, makes them searchable and pulls the useful stuff out, like this library. It's invite-only for now; join the waitlist at https://xiry.app/#waitlist.