<mq-fretboard-scale>
Fretboard with scale visualization across the full neck. Custom tunings
(drop D, ukulele…), configurable fret range, note-labels,
degree-labels, and left-handed.
npm install @hsablonniere/musiq
import '@hsablonniere/musiq/mq-fretboard-scale';
| Attribute | Property | Type | Default | Description |
|---|---|---|---|---|
scale |
scale |
string |
— | Scale name (e.g. "C major", "A minor pentatonic", "D dorian"). See tonal scale-type for the full list of supported scales |
tuning |
tuning |
string |
'E,A,D,G,B,E' |
Open string notes, comma-separated from low to high (e.g. "D,A,D,G,B,E" for drop D) |
start-fret |
startFret |
number |
0 |
First fret displayed. 0 includes open strings |
end-fret |
endFret |
number |
12 |
Last fret displayed |
note-labels |
noteLabels |
boolean |
false |
Show note names on dots |
degree-labels |
degreeLabels |
boolean |
false |
Show scale degree numbers on dots |
left-handed |
leftHanded |
boolean |
false |
Mirror the fretboard for left-handed players |
inlays |
inlays |
boolean |
false |
Show fret position markers (inlays) on the fretboard |
| Property | Default | Description |
|---|---|---|
--mq-fretboard-scale-active-color |
#2980b9 |
Dot color for scale notes |
--mq-fretboard-scale-root-color |
#c0392b |
Dot color for root notes |
| Part | Description |
|---|---|
title |
Scale name heading above the fretboard |
dot |
Scale note dots on the fretboard |
fret-number |
Fret number labels (forwarded from mq-fretboard) |
Show scale degree numbers with the degree-labels attribute.
Combine note-labels and degree-labels.
Right-handed
Left-handed
Drop D — tuning="D,A,D,G,B,E"
Customize via --mq-fretboard-scale-active-color and --mq-fretboard-scale-root-color.