chordProSVG
© G. Schacherl 2021, 2025 v3.5
Find Key
From
C
C#
Db
D
Eb
E
F
F#
Gb
G
Ab
A
Bb
B
to
C
C#
Db
D
Eb
E
F
F#
Gb
G
Ab
A
Bb
B
Transpose
❌
{title: Swing Low Sweet Chariot} {subtitle:Spiritual} {artist:Composer: Anonym} {key: D} {x_href:https://en.wikipedia.org/wiki/Swing_Low,_Sweet_Chariot} {c:Audio: © Gerhard Schacherl} {x_foreignObject_audio:swing_low.mp3} {sot} ASCII-TAB: Begleitfigur Gitarre, D-Dur, Achtelnoten E |--------2-----------2-----| B |--------3-----------3-----| G |-----2-----2-----2-----2--| D |--0-----------0-----------| A |--------------------------| E |--------------------------| {eot} {start_of_chorus} [D]Swing low, sweet [G]chari[D]ot, Comin’ for to carry me [A7]home. [D]Swing low,[D7] sweet [G]chari[D]ot, Comin’ for to [A7]carry me [D]home. {end_of_chorus} 1. I [D]looked over Jordan, and [G]what did I [D]see, Comin’ for to carry me [A7]home. A [D]band of angels [G]comin’ after [D]me, Comin’ for to [A7]carry me [D]home. {soc} Chorus {eoc} 2. If [D]you get there be[G]fore I [D]do, Comin’ for to carry me [A7]home. Tell [D]all my friend [G]I'm comin' [D]too, Comin’ for to [A7]carry me [D]home. {soc} Chorus {eoc} {comment: chordProSVG © G. Schacherl} # makes SVG from chordPro text
Convert to SVG
Append to SVG
SVG: change braille space to space
600
SVG-Source: normal, CSS extern
SVG-Source: normal, CSS intern
SVG-Source: scalable, CSS extern
SVG-Source: scalable, CSS intern
Copy to
clipboard
Show/Hide
CSS intern
Preview
CSS normal (intern)
svg { background-color:#f0f0f0; } text {font-family:sans-serif; font-size:1em} .akkord {font-weight:bold; fill:red} .CPtitle {font-size:1.2em; font-weight:bold} .CPsubtitle {font-size:1em;} .CPartist {font-size:0.7em; font-style:italic} .CPcomment {font-size:1em; font-style:italic} .CPraute {font-size: 0.7em; color: #a0a0a0} .CPtab {font-family: monospace;} img{ height:100vH; width: auto; } .internetlink{ font-size: 0.7em; fill:blue; text-decoration: underline; } foreignObject, audio{ width:300px; height:30px; }
CSS scalable (intern)
svg { background-color: #f0f0f0 !important; max-width: 100%; display: block; margin:auto; box-sizing: border-box; } text {font-family:sans-serif; font-size:1em} .akkord {font-weight:bold; fill:red} .CPtitle {font-size:1.2em; font-weight:bold} .CPsubtitle {font-size:1em;} .CPartist {font-size:0.7em; font-style:italic} .CPcomment {font-size:1em; font-style:italic} .CPraute {font-size: 0.7em; color: #a0a0a0} .CPtab {font-family: monospace;} img{ height:100vH; width: auto; } .internetlink{ font-size: 0.7em; fill:blue; text-decoration: underline; } foreignObject, audio{ width:300px; height:30px; }