Welcome to Tonnetz Pro! What began as an isomorphic chord explorer is now a fully-featured, offline-capable, in-browser DAW (Digital Audio Workstation) with professional stem exporting.
1. Geometric Navigation & Chords
This workstation uses Euler's Tonnetz (German for "tone network"), a geometric representation of tonal space where chords that sound mathematically pleasant together are physically touching on the grid.
Horizontal Axis: Moving left to right moves in perfect fifths (C -> G -> D).
Diagonal Axes: Moving along diagonals steps in major and minor thirds.
Triangles = Triads: Click any upward-facing triangle to play a Major chord. Click any downward-facing triangle to play a Minor chord.
Move (=pan) the grid by clicking and dragging on empty space (desktop), or use the on-screen D-Pad. Zoom with your scroll wheel or the + / - buttons.
2. Performance Pads & Arpeggiator (🎛️)
You don't need to stretch your mouse across the grid to play complex jazz chords. Use the Performance Pads (mapped to the left side of your physical keyboard) to instantly modify any note or triad you click:
Extensions & Alterations: Use the letter rows (Q-T, A-G, Z-B) to instantly inject lush Jazz tensions. You can alter 5ths (♭5, ♯5), suspend 3rds (sus2, sus4), or stack deep extensions (Maj7, 9, 11, 13, ♭9, ♯9, ♯11, ♭13). When Show Ext. Highlights is ON, safe 7th and 9th extensions light up with a green border.
Octave Jumps: Hold 1 or 2 to drop or raise your playing by a full octave instantly.
Arpeggiator: Hold 3 (Up), 4 (Down), or 5 (Random) to automatically step through the notes of the shapes you press. Control the speed and rhythm via the Arp/Metronome BPM slider.
Foot Pedals: Hold the Spacebar to Sustain notes, or the Left Alt key to Dampen them (smoothly muffling actively sustaining voices like an 'una corda' piano pedal).
3. Synthesizer & Persistent Samples
Shape your sound deeply using the dual-oscillator synth engine, or pick from beautifully calibrated acoustic and retro analog presets.
Custom User Samples: Select "custom sample" from the instrument preset drop-down, then click "Load SAMPLE" to use your own .wav files as oscillator sources. Your uploaded files are now permanently saved to the browser's IndexedDB database and will survive page reloads!
ADSR Envelope: Visually sculpt your Attack, Decay, Sustain, and Release times to create anything from sharp rhythmic plucks to slowly swelling cinematic pads.
De-Click Engine: Found in the Mixer panel, this applies a micro-fade (0-50ms) to the start and end of notes, preventing hardware speaker pops (especially useful on mobile or during fast arpeggios).
Modulations: Dial in modulation across three parameters independently: Vibrato (Pitch), Tremolo (Volume), and Sweep (Auto-Wah filter). Add sub-oscillators, noise generators, and stereo effects like Chorus, Echo, and Reverb.
4. Drum Machine & Metronome (🥁)
Select from 16 built-in rhythm presets ranging from Rock and Breakbeat to House and Bossa Nova.
Auto-Embellish: Lets the drum machine intelligently add humanized ghost notes, fills and variations to make static presets sound organic.
Manual Triggers: Use the on-screen drum pads to finger-drum custom beats. You can adjust the vertical height of these buttons to fit your screen perfectly.
5. The Multitrack Studio (🎙️)
Tonnetz Pro features a 16-track recording environment divided into two distinct engines. Access them via the STUDIO panel.
The Looper (L1-L8): 8 tracks dedicated to cyclical loop recording. Perfect for building drum beats and repetitive chord progressions.
The Arranger (A1-A8): 8 linear tracks that stretch across a timeline. Perfect for recording evolving melodies over your loops, or catching imported audio stems.
Recording: Select a track, choose Synth or Drums, hit the red Record button, and play! The engine is agnostic and will adapt to whatever instrument you are currently playing.
Master Recording: Use the bottom of the Studio panel to bounce your entire jam session (synths, loops, and drums) to a downloadable WebM, MP4, MP3, or uncompressed WAV file.
6. Project Export & Import (.dawproject)
Tonnetz Pro is fully cross-compatible with professional DAWs like Bitwig Studio, Studio One, and Cubase via the open-source .dawproject format.
📦 OUT (Export): Clicking this will package your 16 tracks into a single .dawproject file. It automatically generates high-quality WAV Stems, raw binary MIDI files of your performances, and invisibly embeds your exact Tonnetz UI session state.
📥 IN (Import): Upload any ZIP or DAWproject file here.
Native Recall: Uploading a file exported from Tonnetz Pro will instantly restore your entire non-destructive session (synthesizer parameters, MIDI notes, and UI).
Foreign Import: Uploading a DAWproject made in a program like Bitwig will extract the track names, colors, and BPM, and safely drop the first 8 audio stems directly onto your linear Arranger tracks for playback!
7. Harmonic Heatmap & Gravity Engine
A real-time compositional assistant that visualizes musical tension and predicts functional chord resolutions directly on the grid.
Psychoacoustic Heatmap: Colors nodes based on calculated dissonance against your active chord. Green/Yellow indicates stable tones, while Orange/Red indicates high tension. Select a genre tuning (Classical, Pop/Rock, Jazz) in the Settings panel to shift the mathematical interval weights.
Gravity Beacons: Visualizes where unstable chords (Dom7, Dim, Sus) and substitutions want to resolve using high-contrast hollow borders and glowing text.
Local Gravity: Standard isolated chord resolutions, highlighted in light blue.
Sequence Gravity: Grammatical progression endings, highlighted in pink. The engine tracks your chord history to detect cadences (e.g., ii -> V, IV -> V) and chromatic walkdowns.
BPM-Synced Buffer: A tempo-synced memory window aggregates arpeggios into single harmonic entities, allowing the engine to "look through" passing notes and identify the underlying progression accurately.
8. Advanced Theory & UI Setup (⚙️)
Circle of Fifths: Toggle the ⭕ button to view a floating, interactive minimap of the Circle of Fifths to guide your harmonic progressions.
Snap to Scale: Locks the grid so that any note you press is forcefully snapped to the nearest valid note in your chosen Key and Mode (e.g., Dorian, Lydian Dominant).
Tuning Systems: Switch from Equal Temperament to Just Intonation or Pythagorean Tuning to hear chords with mathematically perfect, beatless tuning ratios.
Panel Auto-Hide (⏱): Every side panel has a small ⏱ toggle button in the top right corner. When activated (Blue), the panel will automatically vanish the moment you touch the Tonnetz grid to give you room to play, and instantly reappear when you release.
9. MIDI Connectivity
MIDI IN: Connect any USB MIDI keyboard to play the Tonnetz Pro synthesizer using physical keys. The app responds dynamically to pitch, velocity, and sustain pedal events.
MIDI OUT: Use Tonnetz Pro as an interactive geometric MIDI controller! The chords, arpeggios, and extensions you click on the Tonnetz will be sent out to your external hardware synthesizers or your favorite DAW. Toggle between "Browser + MIDI" or "MIDI Only" to save CPU when controlling external gear.