Application

Chord Keys

Chord Keys is a free piano practice app. It identifies the chords you play, suggests new ones to explore, and lets you hear them instantly, directly in your browser.

Use a MIDI keyboard, your computer keyboard, or the on-screen piano. No account or installation required.

View project details
Chord Keys

Reading a chord diagram and finding the notes on a keyboard are two separate steps. Chord Keys connects them: the reference explains the chord, and the same page lets you play it.

We designed the experience to be accessible without registration, with chord recognition and audio handled locally in the browser.

Project details

Key Features

  • Real-time identification of the chords you play.
  • Chord suggestions with instant playback to develop your ear.
  • Scale highlighting to help you see which notes belong to your chosen key.
  • MIDI input and output to connect compatible keyboards and music software.
  • 240 reference pages covering chords, scales and keys, with interactive keyboards.

Technical Approach

The learning library brings explanations and interactive keyboards together, so visitors can read about a chord and play it on the same page.

Reference pages are generated as HTML, with interactive features for playing the examples. Chord recognition and sound generation run in the browser.

  • React 19, TypeScript, Vite and Tailwind CSS.
  • Web MIDI for instrument connectivity and Web Audio for sound generation.
  • Static reference pages with structured data for search engines.