Demonstration of extracting embedded pitch and rhythm information from SVG images.

Coloring notes by pitch-class

Here is an example of using CSS to color pitches in an SVG image:

load into VHV

Here is the styling added to the page in order to color the pitches:

<style>
.note.pname-c { fill: green;         }
.note.pname-d { fill: blue;          }
.note.pname-e { fill: firebrick;     }
.note.pname-f { fill: gold;          }
.note.pname-g { fill: darkturquoise; }
.note.pname-a { fill: purple;        }
.note.pname-b { fill: orange;        }
</style>