Notation Types

Lyrics, chords, guitar tab, drum sequencer, and piano roll editors.

Every element in Nitesong can carry one or more notation types — different ways of capturing musical ideas. You can layer lyrics, chords, guitar tab, a drum pattern, and a piano roll on the same element, or keep things simple with just one.

To add a notation type, click the + Add Notes button on any element. A popover menu appears with five options:

Notation TypeWhat It Does
LyricsPlain text editor with line numbers
ChordsChord progression with voicings
Guitar TabTablature notation for guitar
Drum PatternStep sequencer for drum beats
Piano RollMIDI-style note editor

A sixth option, Staff (standard music notation), is shown in the menu but marked as "Coming Soon."

Multiple notation types can coexist on a single element, so you could have lyrics with chords and a piano roll all in the same place.


5a. Lyrics

The lyric editor is the simplest notation type — a focused writing environment for your words.

The Lyric Editor

When you select Lyrics from the Add Notes menu, the editor opens automatically. Each element can have one lyric block.

The editor is a plain text area with a few thoughtful touches:

  • Line numbers appear in a gutter on the left side, so you can reference specific lines when collaborating ("let's rework line 7")
  • Synced scroll — the line numbers scroll in lockstep with the text area, so they always stay aligned
  • Heading font — lyrics render in a clean, expressive font that feels more like writing than code
  • Placeholder text reads "Write your lyrics here..." to get you started

The editor has a comfortable size range: it starts at a minimum height of 8rem and allows scrolling up to 24rem, so it adapts to short hooks and long verses alike.

Auto-Save

Your lyrics save automatically as you type. Nitesong waits until you pause before saving, so it feels instant without you needing to press a save button.

A subtle hint at the bottom of the editor confirms: "Auto-saves as you type."

Removing Lyrics

The Remove button in the top-right corner of the editor deletes the lyric block entirely. A confirmation dialog appears first ("The lyrics on this element will be permanently deleted") to prevent accidental loss.


5b. Chord Progressions

The chord progression editor lets you build a sequence of chords for any element. Chords appear as draggable badges (sometimes called "chips") that you can reorder, swap, and attach guitar voicings to.

Adding Chords

Click + Add chord to open the chord picker — a searchable popover with a type-ahead search field. If your song has a key set, the chords are organized into four smart categories:

  1. In Key — Diatonic chords that naturally belong to the song's key. For example, in the key of C major: C, Dm, Em, F, G, Am, Bdim.

  2. Secondary Dominants — The V7 chord of each diatonic chord. These are the "spicy" chords that can pull the ear toward a different tonal center. For C major, you would see chords like A7 (V7/ii), B7 (V7/iii), C7 (V7/IV), D7 (V7/V), and E7 (V7/vi).

  3. Borrowed Chords — Chords from the parallel key (modal interchange). If your song is in C major, these come from C minor: Cm, Ddim, Eb, Fm, Gm, Ab, Bb. Borrowing from the parallel key is one of the most common ways to add color to a progression.

  4. All Chords — Everything else. This is the full library of 122 chords for when you want to venture outside the box.

The 122 total chords cover 8 qualities across all 12 chromatic roots: major, minor, diminished, dominant 7th, major 7th, minor 7th, sus2, and sus4.

If no song key is set, you'll see a prompt: "Set the song key to see chord suggestions." You can still add chords from the full list by toggling the "Show all chords" switch.

Scale Degrees

When a song key is set, each chord in the picker displays a Roman numeral scale degree next to its name (like I, ii, IV, V7, etc.). If you change the song key, the Roman numerals update automatically to reflect the new harmonic context.

Chords are sorted in the picker by scale degree so you can quickly scan through the natural progressions.

Reordering

Chord badges support drag-and-drop reordering. Grab any chord badge and drag it left or right to change its position in the progression.

You can have the same chord appear multiple times in a progression — for example, a I-IV-V-IV pattern where the IV chord appears twice.

Capo

Each element has its own capo setting (0 through 11 semitones). When you set a capo, all voicing calculations for that element are adjusted accordingly. This is useful when you want to write a section with a capo and another section without.

If the capo on one element conflicts with other elements in the same section, you'll see a capo conflict warning with an option to revert to the previous value.

The capo setting is saved automatically whenever you change it.


5c. Guitar Voicings

Once you have chords in your progression, you can attach specific guitar voicings to each one. This tells collaborators (and your future self) exactly how to finger each chord.

Voicing Picker

Click on any chord badge to open the voicing picker — a popover that lists all available voicings for that chord. Each voicing shows:

  • A name (like "C Open", "A Capo 3 (G shape)", or your custom name)
  • A small fretboard diagram previewing the fingering
  • A CAGED shape badge for transposed voicings (color-coded by shape)

Voicings are sorted with stored voicings first, then computed (CAGED-transposed) voicings, grouped by capo position.

When you select a voicing, the chord badge updates to show the voicing name below it in small text.

Voicing Editor

For more control, you can create or edit voicings using the interactive fretboard editor. This is a visual guitar neck where you can:

  • Click fret intersections to place or remove finger positions
  • Click the string markers above the nut to cycle between open (O), muted (X), and fretted states
  • See fret numbers along the left side for reference
  • See the capo indicator as an amber bar when a capo is active

Voicings represent the "shape" your hand makes relative to the capo — so the same shape at different capo positions produces different chords. The fretboard display automatically zooms in to show just the relevant frets for each voicing.

The CAGED System

Nitesong uses the CAGED system to automatically generate voicings for chords all over the neck. The CAGED system is based on five foundational open chord shapes (named after the chords C, A, G, E, and D) that can be moved up the neck with a capo or barre to create any major chord.

The system includes:

  • 5 major shapes: C, A, G, E, D
  • 3 minor shapes: Am, Em, Dm

These are built-in as open voicings (capo = 0). Nitesong automatically transposes them for you:

  1. Finds all open voicings from chords with the same quality (major, minor, etc.)
  2. Filters to true CAGED shapes — voicings that have at least one open string (fret 0) and a maximum fret of 4 or below
  3. Calculates the capo offset needed to transpose the shape to the target chord's root note
  4. Filters out voicings where the highest absolute fret would exceed the 12th fret (to keep things playable)
  5. Assigns color-coded shape badges so you can tell at a glance which CAGED shape a voicing is based on

For example, if you need an F# major chord, the system finds the open D major shape and transposes it to capo 4 (since F# is 4 semitones above D), giving you an F# chord using the familiar D shape.

Computed voicings are generated automatically. When you select one, it is saved to your account so it persists.

Barre Chords

Barre chords are stored differently from CAGED voicings. Instead of using a capo offset, they are stored as literal fret positions. For example, an F major barre chord is stored as literal fret positions like 1-3-3-2-1-1 — those are the actual frets your fingers press.

The library includes E-shape and A-shape barre chords for all 12 root notes, giving you the two most common barre chord forms across the neck.

Voicing Types

Nitesong ships with over 120 default voicings covering a wide range of chord types:

CategoryApproximate Count
CAGED major~45
CAGED minor~24
Barre major~20
Barre minor~20
Diminished~32
Dominant 7th5
Major 7th6
Minor 7th3
Sus25
Sus45
Power chords8

Custom Voicings

Beyond the defaults, you can create your own voicings using the voicing editor. Custom voicings are tied to your user account and appear alongside the defaults in the voicing picker. You can also edit and delete your custom voicings — but default voicings are read-only.


5d. Guitar Tablature

The tab editor provides a traditional six-string tablature grid for notating guitar parts note by note.

The Tab Editor

When you select Guitar Tab from the Add Notes menu, Nitesong creates a first tab line automatically and opens the editor. Unlike chords and drums (which are 1:1 with an element), tab lines allow you to add multiple tab lines to a single element. This is useful for writing out a verse riff and a fill separately, or breaking a long passage into manageable chunks.

Each tab line has:

  • 6 strings — six strings in standard EADGBE tuning (low E to high e)
  • Display order — tab lines are displayed top to bottom. The display follows standard tab: the top row is the high e string, the bottom row is the low E string.

The tuning is fixed to standard EADGBE. Custom tunings are not yet available.

String labels appear on the left side of the grid: e B G D A E from top to bottom, matching standard guitar tab notation.

Keyboard Navigation

The tab grid is designed for fast entry using your keyboard:

  • Arrow keys — move between cells in all four directions (left/right between positions, up/down between strings)
  • Number keys — type a fret number to enter it in the focused cell. For double-digit frets, type both digits in sequence (e.g., type 1 then 2 for fret 12). The editor uses smart logic to determine when a digit starts a new number vs. continues the previous one — single digits 3-9 commit immediately since they can't form a valid two-digit fret (max fret 24), while digits 0-2 wait briefly for a possible second digit.
  • Delete / Backspace — clears the current cell
  • Tab — advances to the next position on the same string

While entering a two-digit number, you'll see the first digit followed by an underscore (like 1_) to indicate the editor is waiting for the second digit.

Length Presets

Each tab line has a configurable length. Choose from four presets: 8, 16, 32, or 64 positions. The default is 32. When you shrink a tab line, positions beyond the new length are removed. When you grow it, empty positions are appended.

Length preset buttons appear below each tab line.

Multiple Tab Lines

Click + Add Tab Line to add another tab line below the existing ones. New lines inherit the length of the most recent tab line. Each line saves independently.

Saving

Cell edits save immediately — there is no save button. Each cell change persists as soon as you type it. Length changes also save immediately.

Removing

The Remove button at the top removes all tab lines from the element at once, with a confirmation dialog.

Hint Bar

A hint line appears at the bottom of the editor: "Click cell + type fret number. Delete/Backspace to clear. Arrow keys to navigate."


5e. Drum Step Sequencer

The drum sequencer is an FL Studio-style channel rack for programming drum patterns. It is one of the most feature-rich notation types in Nitesong.

The Drum Grid

When you select Drum Pattern from the Add Notes menu, the sequencer opens automatically. Each element can have one drum pattern.

The grid layout:

  • Rows are drum samples (instruments), listed vertically on the left
  • Columns are time steps, running left to right
  • Beat numbers appear above the grid, with downbeat markers at the start of each beat
  • Alternating beat groups get slightly different background shading to help you keep your place
  • An "x" button on each row label lets you hide that sample

Default Kit

The default drum kit includes 8 samples:

SampleLabelMIDI NoteFile
kickKick36 (C1)kick.wav
snareSnare38 (D1)snare.wav
hihat-closedClosed HH42 (F#1)hihat-closed.wav
hihat-openOpen HH46 (A#1)hihat-open.wav
clapClap39 (D#1)clap.wav
rimshotRim37 (C#1)rimshot.wav
tom-lowLow Tom45 (A1)tom-low.wav
tom-highHigh Tom50 (D2)tom-high.wav

MIDI note numbers follow the General MIDI drum map standard for compatibility with DAWs.

Beat Presets

The grid length is defined by beats x subdivision. The subdivision is fixed at 4 steps per beat (giving 16th note resolution). You choose the number of beats from three presets:

BeatsTotal StepsMusical Length
416One bar of 4/4
832Two bars
1664Four bars (max)

The default is 4 beats (16 steps). When you reduce the beat count, steps beyond the new length are automatically removed.

Interaction Modes

The sequencer has two interaction modes, toggled via the toolbar:

Note mode (default):

  • Click an empty cell to add a note (default velocity 3 out of 4)
  • Click an active cell to remove it
  • Right-click any active cell to remove it

Velocity mode:

  • Click an active cell to cycle its velocity: 1 -> 2 -> 3 -> 4 -> 1
  • Clicking an empty cell does nothing (you need to add the note in note mode first)
  • Velocity numbers are displayed inside each active cell

Velocity Levels

There are 4 velocity levels, displayed visually as varying opacity:

LevelOpacityMeaning
125%Ghost note
250%Soft
375%Normal
4100%Accent

Active cells are colored blue, with the opacity reflecting the velocity. In velocity mode, the numeric level is also shown as small text inside the cell.

Hiding Samples

If you don't need all 8 samples visible (for example, you're only using kick, snare, and hi-hat), you can hide samples by clicking the small x next to the sample label. Hidden samples:

  • Disappear from the main grid
  • Are listed below the grid in a "Hidden" row with + buttons to restore them individually
  • Are muted during playback (they won't sound even if they have active steps)

The Reset button clears all steps and restores all hidden samples back to the grid.

Playback

Press Play to hear your pattern loop in real time, synced to the song's BPM. The current step is highlighted with a ring indicator that sweeps across the grid.

Playback details:

  • Audio samples are loaded when you open the editor
  • Velocity maps to volume: level 1 = 25% volume, level 4 = full volume
  • The BPM display in the toolbar shows the current song tempo

MIDI Export

Click Export MIDI to download a standard MIDI file of your drum pattern. The export uses:

  • Format 0 (single track)
  • Channel 10 (the standard MIDI drum channel)
  • GM drum mapping (the MIDI note numbers match General MIDI, so your pattern will sound correct in any DAW)

The downloaded file is named {song-title}-{section-name}-drums.mid.

Saving

Changes save automatically shortly after your last edit. The entire pattern is saved as a single update.

Hint Bar

"Click to toggle. Right-click to remove."


5f. Piano Roll

The piano roll is a MIDI-style note editor for writing melodies, bass lines, harmony parts, or any pitched musical idea. It is the most complex notation type in Nitesong.

The Piano Roll

When you select Piano Roll from the Add Notes menu, the editor opens automatically. Each element can have one piano roll.

Each note has a pitch, a start position, a duration, and a velocity (1 through 4, same scale as the drum sequencer).

The grid has a vertical piano keyboard on the left and a time grid on the right. Beat numbers appear across the top. Vertical lines mark beat boundaries, with stronger lines on downbeats.

Interaction

The piano roll supports intuitive mouse-based editing:

  • Click a piano key on the left to preview that note's sound
  • Click an empty cell in the grid to place a new note (default: 1 step long, velocity 3)
  • Click and drag horizontally on an empty area to create a note spanning multiple steps
  • Drag the right edge of an existing note to extend or shorten its duration. The resize handle appears as a subtle bar on the right side of each note. For single-step notes, the right half of the cell triggers resize; for longer notes, the right third does.
  • Click an existing note to select it (shown with a brighter color and ring outline)
  • Drag a selected note to move it to a different pitch and/or time position
  • Right-click any note to delete it
  • Delete / Backspace key removes the currently selected note

A live preview ghost appears while you're dragging to create or resize a note, so you can see exactly what you'll get before releasing the mouse.

Octave Range

The piano roll shows a configurable range of octaves. The default view spans 2 octaves starting at C3 (MIDI notes 48 through 71).

  • Octave controls in the toolbar let you shift the view up or down with triangle-up and triangle-down buttons
  • The current range is displayed as text (e.g., "C3--B4")
  • The view supports 1 to 4 octaves (12 to 48 rows)
  • You can't shift below octave 0 or above octave 7

Scale Highlighting

When your song has a key set, a Scale toggle appears in the toolbar. Enabling it changes how the grid rows are colored:

  • Off (default): rows follow the standard piano coloring — white key rows get a light background, black key rows get a darker/muted background
  • On: rows follow scale membership instead — notes that belong to the song's scale get a light background, and out-of-scale notes get a muted background. This makes it easy to stay in key while composing.

Scale data is computed automatically from your song's key.

C notes (any octave) always get a slightly stronger border to serve as visual anchors.

Row Virtualization

The editor stays responsive even when showing 4 octaves. Beyond 3 octaves, the grid becomes scrollable vertically.

Beat Presets

The grid length works the same as the drum sequencer: beats x subdivision with 4 steps per beat (16th note resolution). Choose from 4, 8, or 16 beats:

BeatsTotal StepsMusical Length
416One bar of 4/4
832Two bars
1664Four bars

When reducing beats, if any notes would be truncated or lost, a confirmation dialog appears: "Some notes extend beyond the new grid length and will be truncated or removed."

Playback

Press Play to hear your notes loop in real time, synced to the song's BPM. A vertical cursor line sweeps across the grid to show the current playback position.

Playback details:

  • 12 piano samples are loaded, spaced at major third intervals from C2 to Ab5
  • The system pitch-shifts the nearest sample to match each note, keeping the sound natural.
  • Each note fades out naturally at its end time.

Clicking a piano key on the left side plays a preview note at that pitch for 0.5 seconds.

MIDI Export

Click Export MIDI to download a standard MIDI file. The button is disabled when the roll is empty. The export uses:

  • Format 0 (single track)
  • Channel 1 (standard melodic channel)
  • Polyphonic note handling — simultaneous notes at the same start time are grouped intelligently. Notes with the same duration share a single MIDI event; notes with different durations get separate events.

The downloaded file is named {song-title}-{section-name}-piano.mid.

Saving

Changes save automatically shortly after your last edit.

Hint Bar

"Click to place. Drag to extend. Right-click to delete."