skill CX Codex

add-read-aloud — Claude Code skill for text-to-speech

Q: How do I install add-read-aloud in Claude Code?

Run `npx skills add cursor/plugins --skill add-read-aloud -a claude-code`. The skill file is at `~/.claude/skills/add-read-aloud/SKILL.md`.

Q: What does add-read-aloud need to run?

The server needs `XAI_API_KEY`; keep it out of browser code. Browser-based streaming also needs a backend relay.

Builds Grok text-to-speech into an existing app, for read-aloud controls, automatic playback, or spoken page content.

Install into Claude Code · Skills CLI (Vercel) All methods and platforms ↓

npx skills add cursor/plugins --skill add-read-aloud -a claude-code

Open on GitHub

What add-read-aloud does

The skill guides an agent through adding speech playback for completed assistant replies, narration, or generated audio files. Its default route sends text to Grok TTS from the server and returns an MP3. Keep XAI_API_KEY server-side; it must not end up in the browser bundle.

The instructions cover turning formatted text into speech-ready input, handling long messages, and reflecting loading and playback in the app’s controls. Requests are limited to 15,000 characters, so longer text needs splitting or the streaming route. Browser streaming requires a backend relay. Auto-speak should be opt-in and start only after a user gesture.

What it helps with

add a speaker control to completed assistant replies
narrate page text or create an audio file
split long input into TTS-sized parts
keep the Grok API key out of client code

Example prompts for the agent

Add a control that reads completed assistant replies aloud with Grok TTS.
Set up page narration and split long text before sending it for speech.
Make automatic reply playback optional and start it after a user gesture.

How to install add-read-aloud

1Skills CLI (Vercel)

npx skills add cursor/plugins --skill add-read-aloud -a claude-code

2Manually: put the files in place

~/.claude/skills/add-read-aloud/SKILL.md

Copy the whole skill folder; for one project use .claude/skills/add-read-aloud/

1Skills CLI (Vercel)

npx skills add cursor/plugins --skill add-read-aloud -a codex

2Manually: put the files in place

.agents/skills/add-read-aloud/SKILL.md

For all projects use ~/.agents/skills/

1Skills CLI (Vercel)

npx skills add cursor/plugins --skill add-read-aloud -a cursor

2Manually: put the files in place

.cursor/skills/add-read-aloud/SKILL.md

Cursor also reads .agents/skills/ and .claude/skills/

1GitHub CLI

gh skill install cursor/plugins add-read-aloud

2Manually: put the files in place

.github/skills/add-read-aloud/SKILL.md

1Skills CLI (Vercel)

npx skills add cursor/plugins --skill add-read-aloud -a gemini-cli

2Platform CLI

gemini skills install https://github.com/cursor/plugins --path grok-voice/skills/add-read-aloud

Manually: put the files in place

.devin/skills/add-read-aloud/SKILL.md

The legacy .windsurf/skills/ path still works

Skills CLI (Vercel)

npx skills add cursor/plugins --skill add-read-aloud -a opencode

Step by step, with commands for each platform: How to install skills in Claude Code: five ways

Questions about add-read-aloud

How do I install add-read-aloud in Claude Code?

Run npx skills add cursor/plugins --skill add-read-aloud -a claude-code. The skill file is at ~/.claude/skills/add-read-aloud/SKILL.md.

What does add-read-aloud do?

It guides an agent in adding Grok TTS playback to an existing app, such as speech controls for assistant replies or narration for other text. The default approach returns audio as an MP3.

What does add-read-aloud need to run?

The server needs XAI_API_KEY; keep it out of browser code. Browser-based streaming also needs a backend relay.

Similar skills

Everything for AI and ML →

skill-creator official anthropics Creates and refines skills, then tests them with prompts, evaluations, and performance checks. 414,180installs writing-for-agents Matt Pocock Guidance for writing skills and agent-facing documents. Use it when editing AGENTS.md, CLAUDE.md, or reference files reached from them. 466,719installs media-use heygen-com Finds or generates media for HyperFrames videos, including voiceovers, music, cutouts, and color grades. Stores files locally in assets. CX Codex +1 1,100,000installs mcp-builder official anthropics This skill walks through building an MCP server in TypeScript or Python, from reading the protocol spec to writing tests and evaluation questions. 130,949installs subagent-driven-development Jesse Vincent This skill runs an implementation plan through fresh subagents for independent tasks and reviews each result. Use it for multi-step work in one session. CX Codex 237,746installs orchestration stablyai Coordinates supervised Orca workers with task DAGs, decision gates, and threaded messages. Fits workflows that split work across multiple agents. CX Codex +1 349,800installs

From the same set47

setup-benny Walks you through Benny's configuration and its two Cursor automations: issue triage and bug reproduction. Useful when installing Benny or changing its settings. CX Codex +1 787installs X MCP guide This skill guides agents through X connections and MCP tools. Use it when an agent needs to read X data or work with chats, lists, and calls. CX Codex +1 614installs advisor Adds a second model for reviewing decisions, debugging dead ends, and checking work before completion. The mode starts only when explicitly requested. CX Codex +1 404installs add-dictation This skill wires Claude speech recognition into your own app: a mic button, live captions, or transcripts of audio you already have. CX Codex +1 324installs debug-voice Installs dev-only logging for Grok realtime voice sessions and runs a fix loop from the log. CX Codex +1 320installs add-voice Adds two-way Grok voice conversations to an app. Use it when replacing an STT-LLM-TTS chain or an OpenAI Realtime integration. CX Codex +1 319installs origin-api This skill points Origin API questions to relevant documentation and flags rules to check first. Use it when building an Origin App or handling API calls and webhooks. CX Codex +1 313installs port-github-app-to-origin Plans the migration of an existing GitHub App to Cursor Origin. It scans your code for webhooks, API calls, and scopes, mapping them against the live Origin specification. CX Codex +1 337installs