<guitar-fret-board>

A custom html component, guitar fret board SVG graphic for displaying chord shapes scales or notes. Just provide it with a chord object e.g. :

<guitar-fret-board
    chord='{"str6":[{"fret":5,"label":"1"}],
            "str5":[{"fret":7,"label":"3"}],
            "str4":[{"fret":7,"label":"4"}],
            "str3":[{"fret":6,"label":"2"}],
            "str2":[{"fret":5,"label":"1"}],
            "str1":[{"fret":5, "label":"1"}]}'
/>

Install the Polymer-CLI

First, make sure you have the Polymer CLI installed. Then run polymer serve to serve your element locally.

Viewing Your Element

$ polymer serve