01
Echtzeit Piano Roll Flow
Noten fallen wie ein Wasserfall, gefärbt nach Spur, größenskaliert nach Velocity, zeitlich zum Audio. Der klassische Synthesia/GuitarBots-Stil — aber für jede MIDI.
Online MIDI Visualizer
Verwandeln Sie MIDI-Dateien sofort in fallende Noten & Piano-Roll-Animationen.
MIDI-Datei hochladen
Ziehe eine .mid-Datei hierher oder klicke, um sie auszuwählen
or drag and drop MIDI file here
Try a demo:
Der MIDI-Visualizer
Online MIDI Visualizer - MIDI-Dateien auf Piano Roll anzeigen
Verwandeln Sie jede .mid-Datei in eine faszinierende Piano Roll-Animation — direkt im Browser. Sehen Sie Noten in Echtzeit synchron zum Audio fallen, passen Sie Farben und Geschwindigkeit an, machen Sie Screenshots oder Videos für Social Media. Läuft komplett lokal mit WebGL und Tone.js.
Was Sie erhalten
Faszinierende MIDI-Visualisierung, einfach gemacht
02
Ein-Klick-Videoaufnahme
Nehmen Sie flüssige HD-Videos Ihrer Visualisierung direkt im Browser auf. Perfekt für TikTok, YouTube Shorts oder Instagram Reels.
03
Sofortige HD-Snapshots
Erfassen Sie schöne musikalische Momente mit einem Klick. Ideal für Albumcover, Thumbnails oder Desktop-Hintergründe.
04
Custom Visual-Themes
Ändern Sie Notenfarben, Hintergrundverläufe, Partikeleffekte und Glow-Intensität. Passen Sie zum Branding Ihres Videos oder Ihrer persönlichen Ästhetik.
05
Zen (Vollbild) Modus
UI ausblenden, Vollbild gehen, sich im Fluss von Noten und Licht verlieren. Perfekt für Übung, Ambient-Listening oder Events.
06
Per-Track-Sichtbarkeit
Einzelne Spuren ausblenden oder hervorheben — Melodielinie solo für Unterricht, oder Drums ausblenden für sauberere Optik.
So funktioniert's
Von der .mid-Datei zur Visualisierung in unter 5 Sekunden
- 01
MIDI importieren
Eine .mid- oder .midi-Datei droppen oder zum Auswählen klicken. Datei wird sofort mit @tonejs/midi geparst — Spuren, Tempo und Tonart erscheinen unmittelbar.
- 02
Theme wählen
Farbpalette und Hintergrund im Theme-Panel wählen. Gängig: Neon, Pastell, Monochrom oder zur Marke eines Channels passen.
- 03
Abspielen und anpassen
Play drücken. Wiedergabegeschwindigkeit, Notenbreite, Partikelintensität und Per-Track-Sichtbarkeit anpassen, bis es passt.
- 04
Vollbild (optional)
Zen-Modus für ablenkungsfreie Vollbild-Ansicht umschalten. Perfekt für Streaming, Unterricht oder Ambient-Hintergrund.
- 05
Aufnehmen und teilen
Sofort HD-Screenshot machen oder den eingebauten Recorder für ein flüssiges Video nutzen. Direkt herunterladen — kein Wasserzeichen, kein Upload.
Für wen es ist
Gebaut für vier Arten von MIDI-Visualisierung
Content Creators
TikTok / YouTube Visualizer
Verwandeln Sie MIDI-Cover oder Originalkompositionen in einen scroll-stoppenden Visualizer. 60 Sekunden Piano-Roll-Flow aufnehmen und posten — kein Video-Editor nötig.
Musiklehrer
Schülern die Noten zeigen
Ein Stück abspielen und die Piano Roll herabkaskadieren lassen, damit Schüler sehen, was kommt. Tempo verlangsamen, Drums ausblenden, auf Melodielinie fokussieren.
Streamer & VJs
Live-Visuals
Vollbild-Zen-Modus ist ein tolles Live-Visual für Twitch/Discord-Musik-Streams, Ambient-Events oder Gaming-Hintergrund.
Komponisten & Producer
Ihre Komposition vorschauen
Visuellen Durchlauf Ihres DAW-MIDI-Exports. Rhythmus- und Stimmführungs-Probleme schneller erkennen als per Ohr — die Form der Musik wird offensichtlich.
Im Vergleich
MidiToolbox vs andere MIDI-Visualizer
| Feature | MidiToolbox | Synthesia | GuitarBots | PianoVis |
|---|---|---|---|---|
| Browserbasiert | Ja | Nein (kostenpflichtig) | Ja (begrenzt) | Ja |
| Videoaufnahme | Integriert HD | Nur Bildschirm | Nein | Begrenzt |
| Custom Themes | Ja | Ja | Nein | Begrenzt |
| Per-Track-Kontrolle | Ja | Ja | Nein | Nein |
| Zen/Vollbild-Modus | Ja | Ja | Nein | Nein |
| Preis | Kostenlos | $29—$79 | Kostenlos | Kostenlos |
Desktop-Apps wie Synthesia sind poliert, kosten aber Geld und brauchen Download. Browser-Visualizer öffnen eine .mid in Sekunden — toll für einmalige Videos, Unterrichts-Momente oder Ambient-Hintergrund.
Häufige Fragen
Was Leute vor dem Visualisieren fragen
Wenn etwas seltsam aussieht
Häufige Visualisierungs-Probleme und Fixes
- Animation stottert oder verzögert
- Andere Tabs schließen, die CPU/GPU verbrauchen. Partikelintensität und Glow-Effekte im Theme-Panel reduzieren. Sehr dichte MIDI (500+ gleichzeitige Noten) kann schwächere Geräte belasten — Spuren ausblenden.
- Videoaufnahme ist ruckelig
- Der Recorder nutzt Ihre GPU — auf integrierter Grafik oder thermisch gedrosselten Laptops kann er Frames verlieren. Niedrigere Auflösung versuchen, Fenster schließen, oder OBS mit festen 60fps nutzen.
- Farben passen nicht zur Marke
- Theme-Panel öffnen und auf ein Farbfeld klicken für Colorpicker. Custom Themes bleiben pro Browser — Browser-Speicher leeren zum Zurücksetzen.
- Noten scheinen nicht synchron zum Audio
- Der Visualizer richtet Noten präzise zum Audio aus, aber Browser-Audio hat eine kleine Latenz. Wenn Sie aufnehmen, den integrierten Recorder nutzen (der handhabt Sync), nicht Bildschirmaufnahme, die Extra-Frame-Delay hinzufügen kann.
Unter der Haube
Technische Spezifikationen
- Rendering
- WebGL 2 + Canvas 2D
- Audio-Engine
- Tone.js PolySynth
- MIDI-Parser
- @tonejs/midi
- Framerate
- 60 fps Ziel
- Aufnahme
- WebRTC → mp4 / webm
- Verarbeitung
- 100% lokal, kein Upload
Weitermachen
Verwandte MIDI-Tools
MIDI-Player
Dieselbe Datei mit einem SoundFont spielen, BPM steuern und Segmente loopen — besser zum Üben als reine Visualisierung.
Tool öffnenMIDI-Analyzer
Tempo, Taktart, Tonart, Instrumente und Dauer-Statistiken jeder MIDI-Datei sehen.
Tool öffnenMIDI-Konverter
Die .mid mit SoundFont in MP3 oder WAV rendern — toll um Audio mit Ihrem Visualisierungsvideo zu paaren.
Tool öffnenDatenschutz & Lizenz
Parsing, Rendering und Wiedergabe sind 100% lokal — Ihre MIDI-Dateien bleiben auf Ihrem Gerät. Aufgenommene Videos werden auch lokal verarbeitet. Sie sind verantwortlich dafür, dass Sie die Rechte haben, die Quell-MIDI zu visualisieren, zu teilen oder Videos hochzuladen.