🦞 OpenClaw Voice
A walkie-talkie style voice + text chat interface for OpenClaw, built with Next.js 16. Speak into your microphone, get a spoken response back. No cloud APIs required.
Features
- 🎙 Push-to-talk — hold the button to record, release to send
- 👂 Live Mode — toggle on to speak hands-free; messages send automatically at the end of each utterance
- 💬 Text chat — standard text input alongside voice
- 🔊 Text-to-speech — OpenClaw's responses are read aloud via the device's built-in TTS (Web Speech API)
- 🧠 On-device Whisper — audio from PTT is transcribed locally via
@huggingface/transformersrunning server-side on Node.js — no OpenAI key needed - 📡 Streaming responses — OpenClaw replies stream in token by token
- 🔒 No external API keys — only your local OpenClaw instance is required
Tech Stack
| Layer | Technology |
|---|---|
| Framework | Next.js 16 (App Router) |
| Styling | Tailwind CSS |
| Transcription (PTT) | Whisper tiny.en via @huggingface/transformers |
| Transcription (Live) | Web Speech API (SpeechRecognition) |
| Text-to-speech | Web Speech API (SpeechSynthesis) |
| AI backend | OpenClaw (local, localhost:18789) |
| Streaming | Server-Sent Events (SSE) |
Prerequisites
- Node.js 18+
- OpenClaw installed and running locally
Install & configure OpenClaw
npm install -g openclaw@latest
openclaw onboard --install-daemon
# Disable auth for local development
openclaw config set gateway.auth.mode none
openclaw gateway restart
openclaw gateway status
Getting Started
1. Clone and install
git clone https://github.com/your-username/openclaw-voice.git
cd openclaw-voice
npm install
2. Configure environment
Create .env.local in the project root:
OPENCLAW_BASE_URL=http://localhost:18789
OPENCLAW_AGENT_ID=main
No API keys needed.
3. Run the dev server
npm run dev
Open http://localhost:3000.
Project Structure
Description
Languages
TypeScript
99.2%
JavaScript
0.4%
CSS
0.4%