grigson
A markup language for chord charts, with a parser and system of renderers that output to HTML, plain text, and other formats. Transpose to any key, switch between light and dark themes, choose a typeface, and customise notation to taste.
The .chart format
Charts are plain-text files with YAML front matter and pipe-delimited bars. They're readable without any tooling — open one in any text editor and the structure is immediately clear.
---
title: "Blue Bossa"
key: C minor
meter: 4/4
---
| Cm7 | Cm7 | Fm7 | Fm7 |
| Dm7b5 | G7 | Cm | % |
| Ebm7 | Ab7 | Dbmaj7 | % |
| Dm7b5 | G7 | Cm | % ||.
Rendered output
Drop <grigson-chart> into any page and the chart renders to HTML —
no build step required for the browser.
Blue Bossa
C minor
Transposition
Charts transpose to any key on the fly. Useful for instruments in B♭ or E♭, or for practicing in all twelve keys.
Blue Bossa
C minor
Light and dark themes
Built-in CSS custom properties make it easy to match any colour scheme. The slider below compares the two built-in themes side by side.
Blue Bossa
C minor
Blue Bossa
C minor
Chord symbols
Two notation presets ship out of the box — the default symbolic style (♭ ♯ △ ø) and the Real Book style (MI, MA, MI7(♭5)). You can also define your own preset with any HTML fragments.
Blue Bossa
C minor
Typefaces
Choose from three built-in typeface styles — or supply your own font via a CSS custom property.
Blue Bossa
C minor