Piano Streaming — Setup Guide for OBS & Tutorials

A piano streaming overlay puts your keyboard on screen so viewers can see what they hear. The Ultimate Piano runs in a browser window, lights up every note with its name and identifies the chord live — which is why it works as an overlay in any capture software, without a plugin and without a second computer.

On this page

Piano Streaming in Any Browser Compatible Streaming Software OBS Setup — Adding Your Keyboard to the Scene Capturing Just the Keyboard Streaming Guide — Visual Settings for Viewers White Labeling for Branded Streams Performance Tips for Smooth Streaming Use Cases for Piano Streaming Frequently Asked Questions

Piano Streaming in Any Browser

Piano streaming works with The Ultimate Piano because the app runs as an ordinary browser window that any capture tool can grab. The sampled grand piano covers all 88 keys (MIDI notes 21 to 108), and the on-screen keyboard can display 1 to 8 octaves, so you can show a compact 2-octave range for close-up tutorials or the full 88-key layout for full performances.

Compatible Streaming Software

Any software with a Screen Capture (Display Capture) source can grab the piano overlay. The Ultimate Piano is browser-based, so it works with every major broadcasting tool:

OBS Studio — free, open-source, most popular
Streamlabs — built on OBS with added features
XSplit — professional broadcasting suite
Ecamm Live — Mac-only, popular for live lessons

Web MIDI, which delivers your keyboard input to the overlay, is supported in 3 desktop browsers: Chrome, Edge, and Opera. On iPad and Mac, the free MIDIWeb Browser passes a MIDI keyboard through to the web as well — though OBS itself runs on the desktop. See the Wikipedia MIDI article for background on the protocol.

OBS Setup — Adding Your Keyboard to the Scene

The OBS setup takes 5 steps to get your keyboard on screen:

1. Open The Ultimate Piano in Chrome or Edge
2. Connect your MIDI keyboard (see Getting Started for MIDI setup)
3. Press F11 so the browser runs fullscreen — no tab bar, no address bar
4. In OBS, add a Screen Capture (Display Capture) source and select that display
5. Crop the source to the keyboard and position the piano overlay in your scene

Use Screen Capture, not Window Capture: a captured browser window always includes its tab and address bar, so you end up cropping them away every time. Capturing the display of a fullscreen browser gives you a clean image straight away.

Capturing Just the Keyboard

For a cleaner overlay without the browser interface, crop the capture down to the keyboard area:

Run the browser in fullscreen (F11) so no tab or address bar is on screen
Switch off the score if you only want the keyboard: Settings → Display → Score & Chords → Show score
Use the OBS crop filter on the Screen Capture source to keep just the keyboard — this also crops away the header bar

For a solid background that matches your stream layout, switch off Transparent background (on by default) and pick a Background color under Settings → Display → Background. A solid color makes it easier to crop or chroma-key the overlay into your scene.

Streaming Guide — Visual Settings for Viewers

The Ultimate Piano exposes several settings that make your keyboard readable on stream. Configure them for maximum viewer clarity:

Setting	Recommendation	Why
Note Names	Enabled	Viewers see which notes you play
Chord Names	Enabled	Automatic chord recognition on screen
Highlight Color	High contrast (bright on dark)	Visible on small screens
Octaves	4–5	Good balance of visibility and range
Background	Solid color (Transparent background off)	Clean look, easy to crop
Rainbow Keys	Optional	Every white key gets its own colour — C red, D yellow, E green

Chord detection names every chord you play across all 12 keys — from simple major and minor triads to 7ths, sus, and extended voicings, including inversions and slash chords. It works from the notes you hold, and up to two alternative names appear next to the main one.

See Sheet Music Display for notation and chord display options, and Settings for all visual customization.

White Labeling for Branded Streams

White labeling puts your own logo or text in the header, your own logo on the loading screen and your name on exported images, so your stream carries your branding instead of ours. This gives branded content a professional, custom look for a channel or a paid course.

See White Labeling for branding options.

Performance Tips for Smooth Streaming

Smooth streaming comes down to freeing CPU and GPU headroom for the encoder. Apply these tips for lag-free capture:

Close unnecessary browser tabs — frees CPU and memory for OBS encoding
Use hardware acceleration — usually enabled by default in Chrome/Edge
Optimize MIDI latency — see Optimizing Audio Latency for driver and buffer settings
Dedicate one monitor to The Ultimate Piano — keeps the capture clean
Set OBS to capture at 30 or 60 FPS — matches typical browser rendering

Tip: If you use external audio (a DAW or VST plugins) instead of the built-in sounds, route audio through your DAW and mute the Piano row in the Audio Mixer (the speaker icon in the header) — see Piano Audio. See Just Playing for external audio setup.

Use Cases for Piano Streaming

Live Lessons & Teaching

Share your screen during online piano lessons so students see exactly which keys you press, with note names and chord labels. Use Learning Mode to highlight scales or chords for your students. Combine it with Ear Training exercises for interactive listening practice.

YouTube Tutorials

Record piano tutorials with a professional keyboard overlay. Use the Recorder to capture your playing as a MIDI file for later editing.

Twitch & Live Performance

Stream live piano performances with real-time chord detection and note visualization. Enable the Metronome — adjustable from 20 to 400 BPM — for rhythmic sessions. Use the Transport Controller to manage playback without leaving the keyboard view.

Creating Visual Diagrams

Need static images instead of live video? Use the Capture feature to take screenshots of chord voicings, scale patterns, or custom note highlights. See Creating Visual Tutorials for the full guide.

Frequently Asked Questions

Do I need a plugin for piano streaming with OBS?

No. The Ultimate Piano runs in your browser, and you add it to OBS via Screen Capture. It shows note names and chord detection across all 12 keys the moment you play, and any connected MIDI keyboard appears instantly on the on-screen keyboard.

How many steps does the OBS setup take for piano streaming?

5 steps. Open The Ultimate Piano in Chrome or Edge, connect your MIDI keyboard, press F11 for fullscreen, add a Screen Capture source in OBS, then crop it to the keyboard and position it in your scene. Screen Capture avoids the tab and address bar that a Window Capture of a browser always includes.

Can I remove the branding from my stream?

Yes. Enable White Labeling to show your own logo or text in the header, and crop the capture to the keyboard in OBS for a minimal keyboard-only view.

Can I use The Ultimate Piano as a visual overlay with external audio?

Yes. Use The Ultimate Piano purely as a visual overlay while routing audio through your DAW or VST plugins. Mute the Piano row in the Audio Mixer (the speaker icon in the header) and your MIDI keyboard still triggers the on-screen display. See Just Playing for the complete external audio setup.

Related: For everything the stream shows your viewers, see the piano overlay for OBS and streaming page.

Ready to try it?

Open The Ultimate Piano in your browser — no download needed.

Open The Ultimate Piano →