DEV Community

weiwei yang
weiwei yang

Posted on

Building PianoGrid: a simple browser-based piano reference

I built PianoGrid to make everyday piano reference work easier in the browser.

The site focuses on a few practical tasks:

  • finding the notes in a chord and checking inversions
  • comparing scale patterns and keyboard positions
  • reading labeled keyboard diagrams
  • opening printable references when a paper copy is useful

The main constraint was keeping the experience usable without an account. A learner should be able to open a chord or scale page, hear the notes, and understand the result without first creating a profile.

The current release includes chord references, scale references, keyboard-note pages, beginner song references, guides, and a blank sheet-music tool. The pages are designed as direct references rather than a course or a social feed.

You can try it here: https://pianogrid.com

I would especially appreciate feedback from piano learners and developers on the clarity of the keyboard diagrams, the practice flow, and which reference pages would be most useful next.

Top comments (0)