Documentation

Install

npm install -D svelte-guitar

Components

Chord

Purpose

Generates an svg of a guitar chord. Style with the css 'color' attribute.

Usage

<script>
    import { Chord } from "svelte-guitar";
</script>

<Chord
    name="D"
    notes={[{"finger":0,"string":4,"fret":0},{"finger":1,"string":3,"fret":2},{"finger":2,"string":1,"fret":2},{"finger":3,"string":2,"fret":3}]}
/>

Preview

D 1 2 3 X XD

Props

name purpose type default value
class class string ""
id id string ""
size Size in pixels number 200
name Name of the chord string ""
strings Number of strings on the instrument number 6
notes Notes to create the chord Array of note objects []

References