Fretboard Diagrams

The @music-ui/fretboard package provide various ways to render fretboard diagrams.

Installation

pnpm add @music-ui/fretboard

npm install @music-ui/fretboard

yarn add @music-ui/fretboard

Render Scale diagrams

The Fretboard class provides a handy renderScale method for that.

See Scale diagrams docs

Render Chord diagrams

The Fretboard class has a renderChord method as well.

See Chord diagrams docs

Render chord voicings

Need to render drop voicings? Already built-in.

See Chord voicing systems docs

Free positions

Want to have full control on what to render?

See the Fretboard class docs