https://github.com/blesswinsamuel/midi-tools
MIDI tools for routing, monitoring, visualizing, and transmitting real-time MIDI in the browser via Web MIDI.
https://github.com/blesswinsamuel/midi-tools
hacktoberfest midi webmidi
Last synced: 5 days ago
JSON representation
MIDI tools for routing, monitoring, visualizing, and transmitting real-time MIDI in the browser via Web MIDI.
- Host: GitHub
- URL: https://github.com/blesswinsamuel/midi-tools
- Owner: blesswinsamuel
- Created: 2019-04-05T17:51:23.000Z (about 7 years ago)
- Default Branch: main
- Last Pushed: 2026-04-25T11:00:01.000Z (about 2 months ago)
- Last Synced: 2026-04-25T12:23:16.286Z (about 2 months ago)
- Topics: hacktoberfest, midi, webmidi
- Language: TypeScript
- Homepage: https://midi.blesswinsamuel.com
- Size: 1.22 MB
- Stars: 2
- Watchers: 1
- Forks: 0
- Open Issues: 4
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# MIDI Tools
A browser-based toolkit for working with MIDI devices, built with React and the Web MIDI API.
## Features
- **MIDI Devices** — View all connected MIDI input and output devices
- **MIDI Router** — Route MIDI messages from one device to another, with optional transposition
- **MIDI Visualizer** — Visualize live MIDI input on a piano keyboard or Korg NanoKontrol2 layout
- **MIDI Monitor** — Inspect incoming and outgoing MIDI messages in real time
- **MIDI Transmitter** — Send arbitrary MIDI messages (notes, control changes, sysex, etc.) to any output device
## Requirements
- A browser with [Web MIDI API](https://developer.mozilla.org/en-US/docs/Web/API/Web_MIDI_API) support (Chrome / Edge recommended)
- Node.js and [Bun](https://bun.sh) (or npm/yarn)
## Getting Started
```bash
# Install dependencies
bun install
# Start the development server
bun dev
```
Then open [http://localhost:5173](http://localhost:5173) in your browser.
## Build
```bash
bun run build
```
The output will be in the `dist/` directory.
## Tech Stack
- [React](https://react.dev) + [TypeScript](https://www.typescriptlang.org)
- [Vite](https://vitejs.dev)
- [WebMidi.js](https://webmidijs.org)
- [Tailwind CSS](https://tailwindcss.com)
- [shadcn/ui](https://ui.shadcn.com)