Elevate Your Web Apps with Crystal-Clear Speech Synthesis

An ultra-lightweight, promise-based wrapper for the Web Speech API. Deliver natural, fluid, and robust Text-to-Speech capabilities in just one line of code.

Try Live Demo View Code

Why Choose SpeakitJS?

🪶

Ultra-Lightweight

At only 2KB, SpeakitJS adds powerful audio features to your stack without slowing down your client load times or bloating production build sizes.

⚡

One-Line Implementation

Initialize, pass text strings, and configure playbacks natively with zero boilerplate. It is designed to be elegant, clean, and immediately productive.

🎯

Smart Language Filters

Seamlessly query, narrow down, and isolate voices based on precise ISO/BCP 47 language locales such as Argentine Spanish, Italian, or US English.

🌐

Leverages Natural Cloud Voices

Unlocks advanced premium neural and remote voices natively rendered within modern browser architectures like Google Chrome and Microsoft Edge.

Implementation Examples

Copy and paste these snippets to instantly integrate SpeakitJS into your project workspace.

1. Include Library in <head> 
<!-- Reference manually the SpeakitJS production distribution script -->
<script src="Speakit.1.1.0.cdn.min.js"></script>


<!-- Or import the Speakit JS Class from the 'JS module' version. -->
import { Speakit } from 'Speakit.1.1.0.min.js';


<!-- No dependences nedded to put Speakit to talk. -->
2. Invocation with 2 Parameters (Language Fallback) 
// Global adjustments for volume, pitch, and playback rate
Speakit.languageFilter = "es-AR"; // Filter for Argentine Spanish
Speakit.utteranceVolume = 0.8;    // Scale from 0.0 to 1.0
Speakit.utterancePitch = 1.0;     // Pitch inflection range
Speakit.utteranceRate = 1.05;     // Speech rate velocity

// Read text using: text content and target language code
Speakit.readText(
    "Hola, bienvenido. Esta es una prueba de reproducción usando dos parámetros en SpeakitJS.", 
    Speakit.languageFilter
)
.then(() => console.log("Speech completed successfully!"))
.catch(err => console.error("An error occurred:", err));
3. Invocation with 3 Parameters (Explicit Voice Engine) 
async function speakWithExplicitEngine() {
    // Configure default properties and target filter
    Speakit.languageFilter = "es-AR"; 
    Speakit.utteranceVolume = 0.9;
    Speakit.utterancePitch = 1.1;
    Speakit.utteranceRate = 1.0;
    
    // Load voices from browser engine cache
    const voices = await Speakit.getVoices();
    
    // Look for a specific natural or local voice matching criteria
    const selectedVoice = voices.find(v => v.name.includes("Natural") || v.lang === "es-AR");
    const voiceName = selectedVoice ? selectedVoice.name : voices[0].name;

    // Invoke text, language signature, and exact voice model name
    Speakit.readText(
        "Reproduciendo texto de prueba con alta precisión usando tres parámetros configurados.", 
        Speakit.languageFilter, 
        voiceName
    )
    .then(() => console.log("Explicit speech synthesis finished."))
    .catch(err => console.error("Playback error:", err));
}

speakWithExplicitEngine();

Interactive Live Playground

Test out SpeakitJS configuration variables directly from your current browser environment.

Get in Touch

Have an interesting project implementation or want to contribute? Drop a message!