Skip to content

03 · 8 genres · real-time synth · MIDI+WAV · 3-band EQ

BrewBeats — AI Browser Music Studio

Prompt to multitrack composition in seconds. Edit on grid, accept ghost-note advice, export MIDI/WAV.

Next.js 14Tone.jsZustandFramer Motion

Problem

AI music gives flat audio files — no editing, no learning, no DAW handoff.

Approach

Pure Tone.js synthesis (no samples), visual grid editor (pencil/eraser/select), AI advisor ghost notes accept/reject, 8 genre presets, per-track 3-band EQ, undo/redo sessions, MIDI+WAV export. Keyboard: Space play, Esc stop, Ctrl+Z/Y, 1/2/3 tools.

Code

From src/lib/ghost-notes.ts — advisor suggestions merge into the composition without destroying user work:

export function getPlayableComposition(
  comp: Composition,
  ghostNotes: GhostNote[],
  ghostInstruments: GhostInstrument[],
  ghostOnlyView: boolean,
): Composition {
  const pending = ghostNotes.filter(g => g.status === 'pending' && g.action !== 'delete');
  // …clone composition, then layer pending ghosts onto
  // existing tracks or brand-new instrument tracks
  // …full merge in repo
}

Preview

Live demo isn’t deployed — run it locally: npm install, npm run devhttp://localhost:3000. No key needed. Try: “chill lo-fi beat with jazzy piano”, then accept a ghost note and export MIDI. Recorded GIF walkthrough lands in L2.

Results

Full compositions editable note-by-note and exportable to any DAW.