<mq-fretboard-chord>
Fretboard with chord diagram. Pass a chord name, get finger positions with
open/muted string indicators and barre support. Guitar and ukulele, multiple
voicings via position, finger-labels, and
left-handed.
npm install @hsablonniere/musiq
import '@hsablonniere/musiq/mq-fretboard-chord';
| Attribute | Property | Type | Default | Description |
|---|---|---|---|---|
chord |
chord |
string |
— | Chord name (e.g. "C", "Am", "Bbmaj7") |
instrument |
instrument |
'guitar' | 'ukulele' |
'guitar' |
Target instrument (determines string count and chord voicings) |
position |
position |
number |
0 |
Voicing index from the chord database (0 = first/most common voicing) |
left-handed |
leftHanded |
boolean |
false |
Mirror the diagram for left-handed players |
finger-labels |
fingerLabels |
boolean |
false |
Show finger numbers (1–4) on dots and barres |
| Part | Description |
|---|---|
title |
Chord name heading above the diagram |
marker |
Open (○) and muted (✕) string indicators above the nut |
dot |
Fretted note dots on the fretboard |
barre |
Barre chord bars spanning multiple strings |
fret-number |
Fret number label (forwarded from mq-fretboard) |
Show finger numbers on dots with the finger-labels attribute.
positionA minor — 4 positions
position 0
position 1
position 2
position 3
Mirror the diagram with the left-handed attribute.
Right-handed
Left-handed
instrument="ukulele"
Customize via ::part(dot) and ::part(barre).