BROWSER DAW · WEB AUDIO API · ZERO INSTALL

THE DAW LIVES IN THE TAB.

WAVR PRO is a full-featured digital audio workstation that runs entirely in your browser. Multi-track timeline, per-track 6-band EQ, five visualizer modes, session persistence, and a complete VST-style plugin system — no download, no subscription, no install.

▶ Launch WAVR PRO Explore features Plugin SDK →
∞
TRACKS
6
EQ BANDS
5
VISUALIZERS
0
INSTALL
SCROLL
MULTI-TRACK TIMELINE 6-BAND EQ PER TRACK DRAG & DROP AUDIO SESSION SAVE / LOAD WAV EXPORT VST-STYLE PLUGINS DRUM MACHINE WAVEFORM VISUALIZER UNDO / REDO HISTORY MUTE · SOLO · ARM MULTI-TRACK TIMELINE 6-BAND EQ PER TRACK DRAG & DROP AUDIO SESSION SAVE / LOAD WAV EXPORT VST-STYLE PLUGINS DRUM MACHINE WAVEFORM VISUALIZER UNDO / REDO HISTORY MUTE · SOLO · ARM
WHAT IT DOES

Every tool you need.
Zero to download.

WAVR PRO ships with a complete recording and production workflow. Everything runs client-side on the Web Audio API — your audio never leaves your machine.

◈
Multi-track timeline
Unlimited tracks with drag-and-drop audio clips, resize handles, context menus, and inertia scrolling. Drag to reorder. Drop audio files directly from the OS. CORE
⊞
6-band EQ per track
SUB shelf, BASS, LO-MID, MID, HI-MID peaks, and AIR shelf — all live with zero-latency BiquadFilter nodes. Visual frequency response overlay. EQ state saves with the session. MIXING
〰
5 visualizer modes
Waveform, spectrum, spectrogram, oscilloscope, and VU meter — all rendering in real time to a canvas. Switch modes mid-playback. VISUAL
◎
Session persistence
Sessions save to IndexedDB with full audio data. Named saves, autosave every 60 s, and a 40-step undo/redo history with a labeled timeline. Export as .wavrproj. WORKFLOW
↓
Offline WAV export
Full mix rendered to 44.1kHz 16-bit stereo WAV via OfflineAudioContext. Progress bar, EQ applied in the bounce. No server roundtrip. EXPORT
⬡
Plugin system
A full VST-style plugin framework — register any WavrPlugin class and it gets a topbar button, modal/drawer chrome, BPM sync, and session state automatically. EXTENSIBLE
▶
Pause in place + seek
Transport pauses at exact position. Drag the playhead anywhere in the timeline and audio restarts from that beat. Click the ruler to seek instantly. TRANSPORT
●
Mic recording
Arm a track, hit Record, and WAVR captures from your microphone via MediaRecorder. Recorded clips drop straight onto the timeline. RECORDING
◑
Project templates
Six synthesized starter sessions: blank, lo-fi hip hop (87 BPM, swing), techno (138 BPM), ambient, pop, and podcast. Each renders instantly with no sample files. TEMPLATES
HOW IT'S BUILT

React shell.
Web Audio core.

React manages UI state. All audio timing, scheduling, and synthesis runs through refs and the Web Audio API — no re-renders in the hot path.

React component layer
WavrPro.jsx — all UI state, track management, history, modals, and session I/O live here as useState/useCallback/useRef hooks.
src/WavrPro.jsx · ~1500 lines
Web Audio scheduling
Clips are scheduled with AudioBufferSourceNode. EQ uses BiquadFilterNode chains. The master chain runs: gain → EQ → analyser → destination. All timing through audioContext.currentTime.
Internal — getCtx(), startPlayback(), buildEQChain()
Plugin SDK
WavrPlugin base class + PluginShell React wrapper + usePluginManager hook. Plugins register once, get BPM sync and session persistence for free.
plugin-sdk/src/ · 3 files, zero dependencies
Session layer
IndexedDB via idb-keyval pattern for named sessions + autosave slot. .wavrproj files store raw PCM float arrays as JSON — portable, no CORS.
IDB_NAME: "wavr-pro" · IDB_STORE: "sessions"
Standalone builds
public/wavr-pro.html and wavr-lite.html are self-contained single-file builds. No server, no build step — open in any browser.
public/ · two HTML files
wavr-pro/
├── src/
│   ├── WavrPro.jsx          ← main DAW component
│   └── wavr-ember-theme.css ← drop-in theme
│
├── plugins/
│   └── DrumMachine/
│       ├── DrumMachine.js    ← pure JS plugin
│       ├── DrumMachinePlugin.jsx ← React wrapper
│       └── test.html         ← standalone test
│
├── plugin-sdk/
│   ├── src/
│   │   ├── WavrPlugin.js     ← base class
│   │   ├── PluginShell.jsx   ← generic wrapper
│   │   └── usePluginManager.js
│   ├── plugins/DrumMachine/
│   └── examples/ExamplePlugin.js
│
├── public/
│   ├── wavr-pro.html         ← standalone full
│   └── wavr-lite.html        ← standalone lite
│
├── docs/                     ← GitHub Pages
├── README.md
├── CONTRIBUTING.md
└── COMMUNITY.md
THE PLUGIN SYSTEM

Ship one plugin.
Build a hundred.

One base class. Four methods. The framework handles everything else — chrome, session state, BPM sync, modal/drawer UI.

INSTRUMENT · INCLUDED
Drum Machine
A 16/32-step sequencer with 8 fully synthesized instruments. Transport-aware, session-persistent, and ready to drop loops directly onto DAW tracks.
KickSnare ClapHH Closed HH OpenTom Hi Tom MidRide
Swing 0–75% · Per-step velocity · Per-instrument volume · Mute & Solo · 4 genre presets · Randomize · Bounce to AudioBuffer
Try the live demo →
WavrPlugin src/WavrPlugin.js
The base class. Extend it to build any plugin. Provides this.ctx, this.bpm, emitBuffer(), emitStateChange(), notify(), and transport hooks.
PluginShell src/PluginShell.jsx
Generic React wrapper. One component works for every plugin — modal, drawer, or inline. BPM sync and state persistence included.
usePluginManager src/usePluginManager.js
Registry hook for WavrPro. register(), toggle(), getHostAPI(). Broadcasts transport events to all open plugins.
ExamplePlugin examples/ExamplePlugin.js
Minimal chord pad — 120 lines demonstrating the complete lifecycle. The recommended starting point for new plugin authors.
Full SDK documentation →
GET STARTED

Two paths.
Both work today.

Use the standalone build for zero-config audio work, or integrate WavrPro.jsx into your React project for full customisation.

PATH A — STANDALONE
1
Download wavr-pro.html from the repo.
2
Open it in any modern browser. No server needed.
3
Drag audio files from your OS onto the timeline lanes.
4
Hit play. Mix, EQ, add the drum machine, export WAV.
PATH B — REACT INTEGRATION
// 1. Import the component
import WavrPro from './src/WavrPro';

// 2. Drop it anywhere in your app
export default function App() {
  return <WavrPro />;
}

// 3. Add the Drum Machine plugin
import DrumMachine
  from './plugins/DrumMachine';

pluginManager.register(DrumMachine);

// 4. Build your own plugin
class MyPlugin extends WavrPlugin {
  static pluginId = "my-plugin";
  mount(el) { /* build UI */ }
  destroy() { super.destroy(); }
  getState()  { return {}; }
  setState(s) { }
}
HONEST BROWSER LIMITS

What it can't do
(yet).

WAVR runs entirely client-side on the Web Audio API. That's a superpower and a constraint. Here's what that means in practice.

🔌
No real VST/AU plugins
WAVR plugins are JavaScript classes, not native VST/AU binaries. You can't load Serum or FabFilter. You can build equivalents in Web Audio.
🎹
No MIDI (for now)
Web MIDI API support is not yet integrated. Hardware MIDI controllers won't work, though the Web MIDI API exists and could be added.
⏸
Audio pauses in background
Browsers throttle or suspend AudioContext when the tab isn't focused. WAVR will pause if you switch tabs during playback.
💾
Storage is browser-local
Sessions live in IndexedDB — local to your browser profile. .wavrproj export/import lets you move sessions between machines or share them.
READY

Open it.
Make something.

No account. No install. No waiting. The DAW is already running at the link below.

▶ Launch WAVR PRO Build a plugin → ↓ GitHub

MIT licence · Web Audio API · React 18 · Zero external dependencies
Works in Chrome, Firefox, Safari, Edge — any modern browser.