Quickstart

Add voice input to any web app in under 2 minutes. Three ways to integrate — pick whichever fits your stack.

1. Get an API key

Sign up at the VoiceLayer Dashboard to get your API key. The free tier includes 60 minutes/month — no credit card required.

2. Add to your app

Script tag
npm
CDN
<!-- Add before </body> — activates every input on the page -->
<script
  src="https://voicelayer.co/sdk.js"
  data-key="pk_live_YOUR_KEY">
</script>
npm install @voicelayer/sdk
import { VoiceLayer } from '@voicelayer/sdk';

VoiceLayer.init({
  apiKey: 'pk_live_YOUR_KEY',
});
<script src="https://voicelayer.co/sdk.js"></script>
<script>
  VoiceLayer.init({ apiKey: 'pk_live_YOUR_KEY' });
</script>

That's it. Every input and textarea on the page now has voice input. Users hold Space to speak on desktop, or tap the pill indicator on mobile.

3. Try it

  1. Open your app in a browser
  2. Click any text input — a pill indicator appears below it
  3. Hold the spacebar and speak — words stream in as you talk
  4. Release to stop
Mobile: A "Tap to speak" pill appears automatically on touch devices. Tap to start, tap again to stop — no keyboard needed.

Configuration options

Customize behavior by passing options to VoiceLayer.init() or as data-* attributes on the script tag:

VoiceLayer.init({
  apiKey: 'pk_live_YOUR_KEY',
  theme: 'dark',          // 'light' | 'dark' | 'auto'
  selector: 'textarea',  // only activate textareas
  showBranding: false,    // hide 'Powered by VoiceLayer' (paid plans)
  onTranscript: (text) => {
    console.log('Transcribed:', text);
    // optionally return modified text
  },
});

See the SDK Reference for all available options.

Next steps