https://github.com/darkvinx88/lm-studio-sts
A modern web-based frontend for LM Studio that integrates speech-to-speech capabilities
https://github.com/darkvinx88/lm-studio-sts
ai frontend gui kokoro-tts lm-studio speech-to-speech web
Last synced: 11 days ago
JSON representation
A modern web-based frontend for LM Studio that integrates speech-to-speech capabilities
- Host: GitHub
- URL: https://github.com/darkvinx88/lm-studio-sts
- Owner: Darkvinx88
- Created: 2026-06-02T19:46:54.000Z (21 days ago)
- Default Branch: main
- Last Pushed: 2026-06-03T15:18:25.000Z (20 days ago)
- Last Synced: 2026-06-03T17:10:26.702Z (20 days ago)
- Topics: ai, frontend, gui, kokoro-tts, lm-studio, speech-to-speech, web
- Language: CSS
- Homepage:
- Size: 740 KB
- Stars: 1
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# LM Studio STS Chat
A modern web-based frontend for LM Studio that integrates speech-to-text and text-to-speech capabilities, creating a complete voice chat interface.
## Features
- **Voice Input**: Vosk-based speech recognition with multiple language support
- **Voice Output**: Kokoro TTS integration for natural speech synthesis
- **Chat Prompts**: load Lm studio saved chat json prompts in the interface directly
- **LLM Integration**: Connects to LM Studio for AI responses
- **Chat Interface**: Modern, responsive chat UI with message history
- **Advanced Settings**: Configurable voice parameters, system prompts, and API endpoints
- **Real-time Status**: Health monitoring for all connected services
## Architecture
```
Frontend (Web) → LM Studio (LLM) → Kokoro TTS (Speech) ← Vosk (Speech Recognition)
```
## Prerequisites
1. **LM Studio**: Installed and running locally
2. **Kokoro TTS**: Local installation with Gradio interface
3. **Python 3.x**: For running the frontend server
4. **Modern Browser**: Chrome, Firefox, Safari, or Edge
## LM Studio STS — Installation Guid
## Requirements
- Python 3.8+ (standard install — tkinter is included)
- [LM Studio](https://lmstudio.ai/) with CLI (`lms.exe`)
- [Kokoro TTS Local](https://github.com/PierrunoYT/Kokoro-TTS-Local) with a Python venv set up
No extra pip packages needed for the wizard or the server.
---
1. **Clone the repository**
```bash
git clone https://github.com/Darkvinx88/LM-Studio-STS.git
cd LM-Studio-STS
```
2. **Double-click `setup_wizard.py`** (or run `python setup_wizard.py`).
3. Fill in the 4 paths using the **Browse** buttons:
| Field | What to select |
|---|---|
| LMS CLI | `lms.exe` — usually `%USERPROFILE%\.lmstudio\bin\lms.exe` |
| Model name | The model identifier as shown in LM Studio |
| Kokoro TTS folder | Root folder of Kokoro-TTS-Local (contains `gradio_interface.py`) |
| Frontend folder | This repository folder (where `index.html` lives) |
4. Click **Verify paths** to check everything is in order.
5. Click **Generate launcher.bat** → a `RunLMStudioTTS.bat` is created in the same folder.
6. Run `RunLMStudioTTS.bat` (optionally as Administrator).
Your settings are saved in `.sts_config.json` — next time the wizard opens pre-filled.
---
## What the launcher does (in order)
1. Starts LM Studio in headless server mode (`lms server start --cors`)
2. Loads the selected model via CLI
3. Starts Kokoro TTS (`gradio_interface.py`)
4. Starts the static frontend server (`serve.py`)
5. Opens the browser at `http://localhost:8000`
6. Vosk speech to text model shoul load automatically (make sure to place the models into their models folder in zip format)
7. You can now chat in text or with voice by pressinng `Ctrl` on your keyboard or the microphone button.
---
## Folder structure expected
```
LM Studio STS/ ← frontend_path
├── index.html
├── script.js
├── style.css
├── ui-extras.js
├── serve.py
├── setup_wizard.py ← run this first
└── RunLMStudioTTS.bat ← generated by wizard
```
---
## Troubleshooting
- **lms.exe not found** — install LM Studio and make sure the CLI is enabled in Settings → Developer.
- **Kokoro venv not found** — follow the Kokoro-TTS-Local setup guide to create the virtual environment.
- **Port already in use** — change the port in the wizard before generating.
### API Endpoints
Configure the following in the settings panel:
- **LLM Endpoint**: `http://127.0.0.1:1234/v1/chat/completions` (default LM Studio)
- **TTS Endpoint**: `http://127.0.0.1:7860/` (default Kokoro TTS)
- **Vosk Model**: Select from available language models
### Voice Settings
- **Voice Selection**: Choose from 50+ available voices
- **Audio Format**: WAV or MP3 output
- **Speed**: 0.1x to 2.0x playback speed
- **Volume**: 0% to 100% volume control
### Speech Recognition
- **Languages**: English (US), Italian,
- **Continuous Listening**: Toggle for always-on recognition
- **Interim Results**: Show partial recognition results
## Usage
1. **Text Chat**: Type messages and press Enter or click Send
2. **Voice Chat**: Hold the microphone button or `ctrl` to record voice input
3. **Settings**: Configure endpoints, voice parameters, and system prompts
4. **Themes**: Switch between different visual themes
5. **Clear Chat**: Remove conversation history and start fresh
## API Integration
### LM Studio API
The frontend connects to LM Studio's OpenAI-compatible API:
```javascript
// Example API call
const response = await fetch('http://127.0.0.1:1234/v1/chat/completions', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
model: 'local-model',
messages: conversationHistory,
stream: false
})
});
```
### Kokoro TTS API
Text-to-speech synthesis via Gradio client:
```javascript
// Example TTS call
const client = await Client.connect('http://127.0.0.1:7860');
const result = await client.predict('/generate_tts_with_logs', {
voice_name: 'af_alloy',
text: 'Hello, world!',
format: 'wav',
speed: 1.0
});
```
### Status Indicators
- **Green Dot**: Service is healthy and responding
- **Red Dot**: Service is unreachable or error occurred
- **Yellow Dot**: Service is checking or starting up
## License
This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
## Acknowledgments
- **LM Studio**: For the local LLM inference platform
- **Kokoro TTS**: For high-quality text-to-speech synthesis
- **Vosk**: For accurate speech recognition
- **Gradio**: For the machine learning interface framework
## Support
If you encounter issues or have questions:
1. Check the troubleshooting section above
2. Verify all prerequisites are installed
3. Ensure all services are running on correct ports
4. Open an issue on GitHub with detailed error information
---