A browser-based visual builder for VST3 audio plugins — design your plugin interface, add parameters, write DSP code, and export ready-to-compile C++ source files in seconds.
| Feature | Description |
|---|---|
| 🎨 Visual Interface Designer | Drag-and-drop canvas — place knobs, faders, buttons, displays, VU meters, oscilloscope and spectrum widgets |
| 🎛️ Parameter System | Add gain, frequency, Q, time, ratio, percentage, toggle and enum parameters with logarithmic/exponential curves and full range control |
| 💻 Monaco Code Editor | Full C++ syntax highlighting for your DSP source and header files |
| 📦 5 Starter Templates | Empty Effect, Compressor, Stereo Delay, Chorus, and Simple Synth |
| 🔧 Plugin Metadata | Set manufacturer, version, category, description and unique plugin ID |
| 💾 Auto-save to localStorage | Projects persist in the browser between sessions |
| ⬇️ Export Source Bundle | Downloads .h, .cpp, CMakeLists.txt, README.md and plugin.json — ready to drop into a JUCE project |
| 🌑 Dark Theme | Sleek dark UI optimised for long audio engineering sessions |
Coming soon — vst-plugin-creator.vercel.app
git clone https://github.com/RhythrosaLabs/vst-plugin-creator
cd vst-plugin-creator
npm install
npm run devOpen http://localhost:5173 in your browser.
npm run build
npm run previewClick + Create Plugin and choose a template:
- Empty Effect — blank canvas, write everything from scratch
- Compressor — pre-wired with threshold, ratio, attack, release, makeup gain
- Stereo Delay — independent L/R delay times, feedback and mix
- Chorus — LFO-driven modulation delay
- Simple Synth — basic monophonic sine-wave VCO with ADSR
Switch to the Interface tab:
- Pick a widget from the toolbox (left panel)
- Drag it anywhere on the canvas
- Select a widget to edit its properties (right panel):
- Label — displayed name
- Link to Parameter — bind the widget to a plugin parameter
- Size (W × H)
- Value Range (min / max)
- Background color and border radius
- Change canvas background color and dimensions with the controls above
Switch to the Parameters tab and click Add to pick from 13 presets:
| Preset | Type | Default Range |
|---|---|---|
| Gain | dB | −60 → +12 dB |
| Filter Cutoff | Hz | 20 → 20 000 Hz (log) |
| Filter Q | — | 0.1 → 10 (log) |
| Threshold | dB | −60 → 0 dB |
| Ratio | :1 | 1 → 20 (exp) |
| Attack | ms | 0.1 → 100 ms |
| Release | ms | 0.01 → 1 000 ms |
| Mix / Dry-Wet | % | 0 → 100 % |
| LFO Rate | Hz | 0.01 → 20 Hz |
| Depth | % | 0 → 100 % |
| Delay Time | ms | 1 → 2 000 ms |
| Feedback | % | 0 → 95 % |
| Toggle On/Off | — | 0 / 1 |
Parameters are grouped by category (Input, Filter, Dynamics, Modulation, Time, Output) and displayed as interactive sliders.
Switch to the Code tab to edit:
- Source (.cpp) — your
processBlockimplementation - Header (.h) — class declaration and member variables
The editor uses Monaco (the same engine as VS Code) with full C++ syntax highlighting, auto-indent and multi-cursor support.
Switch to the Settings tab to configure:
- Manufacturer name, version, category, description
- Unique plugin ID (reverse-DNS format:
com.yourco.pluginname) - Plugin type (Effect vs. Instrument)
Click Export in the top-right header. Five files download automatically:
YourPlugin.h ← C++ header (class declaration)
YourPlugin.cpp ← C++ source (processBlock + factory)
CMakeLists.txt ← CMake build file for JUCE
README.md ← Auto-generated plugin README
YourPlugin.plugin.json ← Full plugin manifest (reimport-ready)
- JUCE 7.x
- CMake 3.22+
- C++17 compiler (Clang 14+, GCC 12+, or MSVC 2022)
- macOS 12+ / Windows 10+ / Ubuntu 22+
# Clone your exported source into a new folder
mkdir MyPlugin && cd MyPlugin
# Copy YourPlugin.h, YourPlugin.cpp, CMakeLists.txt here
# Point CMake at your JUCE installation
cmake -B build -DJUCE_DIR=/path/to/JUCE
cmake --build build --config Release
# Plugin appears in:
# macOS: build/MyPlugin_artefacts/Release/VST3/MyPlugin.vst3
# Windows: build/MyPlugin_artefacts/Release/VST3/MyPlugin.vst3
# Linux: build/MyPlugin_artefacts/Release/VST3/MyPlugin.vst3| Widget | Icon | Description |
|---|---|---|
| Knob | 🎛️ | SVG arc knob — drag vertically to change value |
| Fader | 📊 | Vertical linear fader with thumb |
| Button | 🔘 | Toggle button (on/off) |
| Display | 🖥️ | Numeric value readout |
| Label | 🏷️ | Static text label |
| VU Meter | 📶 | Level meter (green → yellow → red) |
| Scope | 〰️ | Oscilloscope waveform preview |
| Spectrum | 🎵 | Frequency spectrum bars preview |
src/
├── App.tsx # Root component, localStorage persistence
├── types/
│ ├── plugin.ts # Plugin, PluginMetadata, PluginInterface
│ ├── parameter.ts # Parameter with type/category/curve
│ └── widget.ts # Widget types (knob, fader, etc.)
├── components/
│ ├── PluginList/ # Sidebar plugin browser
│ └── PluginEditor/
│ ├── PluginEditor.tsx # Tabbed editor (Interface/Params/Code/Settings)
│ ├── InterfaceEditor.tsx # Drag-and-drop canvas
│ ├── ParameterList.tsx # Parameter list + add preset menu
│ ├── widgets/ # Knob, Fader, Button, Display, Meter widgets
│ └── CodeEditor/ # Monaco C++ editor
├── data/
│ ├── pluginTemplates.ts # 5 built-in templates with real C++ DSP code
│ ├── parameterCategories.ts # Category metadata + icons
│ ├── parameterDefaults.ts # createParameter() factory
│ └── parameterTemplates.ts # Preset parameter banks (filter, dynamics, …)
├── hooks/
│ ├── usePluginState.ts # Plugin state management hook
│ └── usePluginTemplate.ts # Template instantiation hook
└── utils/
├── codeGenerator.ts # Generates VST3-style C++ header + source
├── exportPlugin.ts # Downloads .h/.cpp/CMake/README/JSON bundle
├── parameterUtils.ts # Normalize / denormalize / curve helpers
└── idGenerator.ts # Unique ID generator
| Library | Version | Purpose |
|---|---|---|
| React | 18.3 | UI framework |
| TypeScript | 5.5 | Type safety |
| Vite | 5.4 | Build tool + HMR |
| Tailwind CSS | 3.4 | Utility-first CSS |
| @monaco-editor/react | 4.6 | C++ code editor |
| Lucide React | 0.344 | Icon library |
| @dnd-kit | 6.x | Accessible drag-and-drop |
Contributions are welcome! Please:
- Fork the repository
- Create a feature branch:
git checkout -b feat/my-feature - Commit with conventional commits:
git commit -m "feat: add reverb template" - Push and open a Pull Request
- More DSP templates (reverb, distortion, EQ, pitch shifter)
- MIDI mapping for parameters
- Real-time audio preview using Web Audio API
- Plugin project import from
.plugin.json - Export as JUCE Projucer
.jucerproject - Screenshot/export UI as SVG
- Undo/redo history
MIT © 2025
- JUCE Framework — the industry-standard C++ framework for VST3 plugins
- Steinberg VST3 SDK — VST3 specification
- Monaco Editor — code editing engine
