• e||------|------|-----|----|----|--
• B||------|------|-----|----|----|--
• G||------|------|-----|----|----|--
• D||------|------|-----|----|----|--
• A||------|------|-----|----|----|--
• E||------|------|-----|----|----|--

Click Ù to download this web app for offline and sharing.
Video demonstrations are on ColorTab.org and YouTube

Introducing ColorTab

Create or convert guitar tablature using a new compact notation. ColorTab shows strings by color on a single line instead of six lines of dashes. Converted songs are more convenient on screen or printed page. ColorTab saves space but is easy to read and understand. Chords are under gray in low to high string order. Here is Greensleeves in text tablature and converted (this example will load if Help is clicked while the Tab section is empty).

(Reload or change number of strings to clear the example. Click the Help at the top right to go back to the app.)

Devices

ColorTab can be used online or from html files on any device that supports a web browser like Chrome or Firefox. A laptop or desktop is best for editing, but any device can be used. Basic keyboards (even on a phone) can use ↵ to end a measure, Space adds a column of dashes, . cycles through the strings and , moves back a column. Turning off predictive text is recommended. Saved ColorTab song files can be shared as text by message or email. These small files can be edited, copied and saved to make changes or create new tabs without an internet connection.

Instruments

Tab for any stringed instrument with 4 to 9 strings can be converted or created. The 6 Guitar selector has standard choices with the most common tunings. The instrument name shown in the ColorTab can be edited. String notes and tab matching starting characters can be customized for any tuning. Instrument selection should be done before adding or composing tab. However, the matching pattern and notes can be changed anytime for combining tab from sources with different formats, see the Tuning and Tab Matching section.

Copy Existing Tab

Copy any text tab and paste to immediately convert into ColorTab. Use the browser menu paste, right click or Ctrl/Cmd+V to insert tab copied from other apps. The Paste button is used for tab sections copied in the editor, while clipboard content is pasted by the browser. Lines of text that do not begin with string notes in proper sequence are ignored so an entire page can be copied and pasted at once. Only the tablature portion of pasted text remains after conversion. If "No tab found" results, starting string note letters do not match the beginnings on any group of tab lines. The matching pattern can be changed to match any tab style, see the Tuning and Tab Matching section.

Open, Share and Save Files Ú

The Ù downloads songs as ColorTab web pages (local .html files) using the song title as file name. These can be used offline without Internet, they include all editing tools and can resave as new songs or versions. Tab text files are loaded directly with Open or by drag and drop in the tab area. The new tab from the file will be inserted at the cursor. Import MusicXML tab directly with open or drop. Share your tab with a Clink that stores the notes in a URL that can be sent and bookmarked. Use Save to make a ColorTab text file that includes music note symbols and has very small file size. Export MIDI files from your tab for import into other notation or playback software. Print ColorTab to PDF or paper using the browser print function. The background is white, text and controls do not print, and page scaling and rotation can be set as desired. Choose the print background graphics option for color.

Editing Tab Text

Tab in the text box can be easily edited and ColorTab below is updated instantly. Composing new tab is also quick and easy. All string lines can be changed together. Copy or Cut part of tab text using the start and end of a highlighted selection. Only one line will show as selected but all will be copied or removed. Paste inserts selected lines at the cursor, click or move elsewhere and paste to insert tab anywhere including the end or beginning. Any line can be used to position the insertion cursor. Copy or Cut tab sections to paste them into other text apps from the clipboard. If nothing is highlighted the entire tab text is copied or cut. A Scratch Pad app provided on the website can be used to paste, copy and save ColorTab text.

Backspace and Delete keys remove one column at a time. Space or Insert keys add a column of dashes at the cursor position. Measure bars can be inserted using the ↵, Enter or | key, or by copying. Fret numbers or other characters overtype exising tab. Adding a note that would fall on a bar will insert a new column. Adding at the end fills in dashes on all other lines. Fret numbers typed sequentially on the same string will automatically be separated by dashes, saving keystrokes (two digit entries up to fret 24 will not add dashes). Ò Undo and Ó Redo are Page Up and Page Down keys. ← ↑ ↓ →, Home, End touch or the mouse can be used to move around.

ColorTab Style Choices

|| starts each tab section on a new line, where double || separates parts of the song. New staves in copied tab will paste as parts, but the |'s can be edited as desired to split or join sections. | won't split measures across lines when active. Chords are not broken apart at line ends. - keeps tab spacing or removes dashes. When off like this - , these buttons make a smaller but possibly less readable conversion. Stray letters or symbols not placed near any fret numbers are shown like  this and can control playback as explained in the Music Symbols section. Browser Zoom can be adjusted to make text easier to read or fit more notes on each line. This - can turn off the color stripes in the text area if desired.

Lyrics

The lower portion of the text area is used to paste or type lyrics or other text such as chord names. This will appear below ColorTab lines aligned with measure bars. Spaces in the lyrics area can be used to position text into desired measures. Lyrics for an entire song can be copied and pasted without regard to line breaks, these are removed. Lyric text will skip over measure bars that come from tab text.

Because chords are inline rather than vertical, the position of lyric text is often not perfect. Spaces can adjust positions of words and syllables to match tab notes and chords. When needed, blanks will extend the text tab measures to make room for lyrics. Letter spacing of the lyric text can be adjusted with aa aa buttons.

Measures

Measure bars | usually come from the tab text and are automatically added to the lyric text area. Sometimes it is preferable to start with lyrics, adding measures directly in lyric text to create or move tab measure bar |'s. Tab -> | can be changed to Lyric ->| to use lyrics as the measure | source (Shift-Alt keyboard shortcut). Highlighting will change from gray to blue to indicate this editing mode. Measure bars can then be added, moved or deleted in the lyrics and the tab bars will follow. Once lyrics and tab measure bars are placed, use the |=Lock=| edit mode (Esc shortcut). Highlighted in green, each measure is now edited independantly without affecting others. Tab or lyric text can be added or removed as needed using spaces to change lyric positions. Measure bars cannot be changed while locked. The measure bar source can be changed anytime. Esc and Tab keyboard shortcuts change from Lock to Tab | modes. Alt moves to lyrics from the tab area, ↑ moves back up to the tab.

A warning "Measure |'s not aligned" means there are some extra or missing dashes, or a mistake like I for | in the tab text. Measures should be corrected because some notes might be out of sequence in the conversion. This can be difficult to fix since many measures may be affected and all lines are edited together. Error messages can be stopped by | then editing and | when done. Sections beginning on new lines can be done by adding or removing ||'s in the text as desired.

Chord Names and Lyric Styles

Special text such as chord names in the lyrics portion of ColorTab can be added using [Am7] like this Am7. Text enclosed in (parenthesis) will be italic. Sections such as Chorus are formed by %Chorus% and will insert a blank line when used after || . Any text style can be created by using {} to enclose CSS (Cascaded Style Sheets) instructions. For example {color:yellow; background:blue; font-family:monospace} is this. The style only applies to the individual measure and can be ended by using \ to separate some later text. To add multiple lines in lyrics use <br> and then an empty part || to make room between the ColorTab lines.

Music Symbols

Notes, rests, articulations, barlines, dynamics, fingering, time signatures etc., can be added in the tab or the lyric text area. The Ô button reveals a table with all music symbols. These can be entered at the cursor location with a single click on the desired symbol. Notes should be placed immediately after a fret number to indicate duration in the ColorTab. See the Duration and Timing section for more information.

Musical symbols that are not associated with fret number notes can also be added. These are typically at the beginning or end of measures but can be inserted anywhere. Symbols that do not follow fret numbers will appear in the ColorTab on a gray background like this      They may be red if they can't be correctly interpreted. The text tab is converted to ColorTab from bottom string up to top and then from left to right.

Duration and Timing

See this for additional details and examples. Here are the ways ColorTab uses musical note symbols like  and .

 Symbols that are not by a fret number have a gray background in the ColorTab. These change defaults and affect all following notes.

 Symbols by a fret number will have the color of the string and only affect that note (except in chords).

 A down stem note adds to the duration of all following notes, as in "let ring" This is canceled by a down stem grace note.

 Fret numbers with down stem notes have duration set but this does not affect timing, otherwise duration equals timing

 Fret numbers with multiple down stem notes have duration added for each, so two half notes make a "down stem" whole note.

 Fret numbers followed by multiple up stem notes play as repeated notes of the same pitch.

 Each note in a chord inherits timing and duration of notes below in the chord, unless followed by adjacent note symbols.

 Preceding a note symbol with a superscript ³ will use triplet timing for the next note or rest.

Playback and Sound

A floating transport control has the usual buttons, rewind to beginning, previous measure, play, next measure, go to end and loop as well as  for a metronome. The play position is highlighted with green underbar that turns white as each note sounds or magenta to show repeated plays. Dragging across the tab or ColorTab will select a section for looping. Click  to highlight the loop button, then click  to play.

The sound can be changed from the Offline acoustic steel guitar to many other string instrument sampled sounds if connected to the Internet. Select a sound font like Musyng Kite and then choose from the instrument choices that are available.

sets the default tempo for playback, but this is overridden by any tempo settings symbols like ₁₂₃ in the tab. Those can be placed anywhere and the tempo number will show the current playback speed.

The J button will jump to any measure by number for quick access.

Tuning and Tab Matching

 opens a dialog for changing the tuning or the matching names for copying tab text. There are three characters for each string to match string notes like Eb followed by either |'s or -'s. Spaces and capitalization do not affect copy and paste matching. Matching charaters can also be edited by clicking the area left of the tab text. Pitch for the playback sound is controlled independantly from string matching note names.

A capo-like function + can shift pitch up and down by half steps, negative numbers give lower than standard tuning. The Standard dropdown can choose from many preset alternate tunings. Pitch numbers can also be entered directly, decimal values will create microtonal shifts.

Dashes

There are two dash sizes for timing. Long and short dashes are used according to the text tab spacing. If notes in ascii text tab are as close together as possible, they must still be separated, like 1-2-3. This separation is not required in ColorTab so no dash is used. Enough separation to allow adding a note between two notes requires three dashes in tab like this 1---3. This spacing is represented by a long dash in ColorTab. A short dash is used when this 1--2 sequence occurs. Because text tab spacing is affected by two digit fret numbers and extra characters like b and / the timing indication is often not precise.

Etc.

String colors are chosen for good contrast between any string pair, and for best possible visibility for users with color vision deficiency. They are even usable in grayscale, going dark to light from low to high strings. Fret numbers reverse from black to white for contrast, white for wound strings. Combined with selectable large type size, ColorTab can be easier to read than other notation.

• e||------|------|-----|----|----|--
• B||------|------|-----|----|----|--
• G||------|------|-----|----|----|--
• D||------|------|-----|----|----|--
• A||------|------|-----|----|----|--
• E||------|------|-----|----|----|--

Version 1.21 5/13/2021

1. C
2. o
3. l
4. o
5. r
6. T
7. a
b



         Save and share your tab
 Ù offline .html app and tab ~2Mb
 Save as
 Save tab as CT_file.txt ~10kb

 Done

Edit