Guitar Chord Diagram Generator

The tool supports all common open and barre chords including major (C, D, E, F, G, A, B), minor (Am, Dm, Em, Fm, Gm, Bm), dominant 7th (A7, B7, G7, etc.), minor 7th (Am7, Bm7, Em7), major 7th (Cmaj7, Gmaj7, etc.), suspended (Dsus2, Asus4, Esus4), power chords (E5, A5, D5), diminished, augmented, and add9 chords. Sharps (#) and flats (b) are fully supported.

A chord diagram shows a guitar neck from the front. The six vertical lines represent the six strings from low E (left) to high e (right). Horizontal lines are frets. Filled dots show where to place your fingers. Numbers inside the dots indicate which finger to use (1 = index, 2 = middle, 3 = ring, 4 = pinky). An "O" above a string means play it open; an "×" means mute that string.

The thick bar at the top represents the nut of the guitar — the small ridge near the headstock. When this bar is thick, the chord starts from the first fret. If the diagram shows a fret number (e.g. "5fr") on the left side instead, it means the chord starts higher up the neck and you should position your fretting hand at that fret.

A barre chord is played by pressing one finger (usually the index finger) across all or several strings at the same fret. In the diagram, it appears as a rounded bar spanning multiple strings. Common examples are F major (barre at fret 1) and Bm (barre at fret 2). Barre chords let you play any chord shape up and down the neck.

Yes — click the "Download Diagram" button to save the chord chart as an SVG file. SVG is a vector format that scales perfectly to any size without losing quality, making it ideal for print, presentations, websites, and music sheets. The filename includes the chord name automatically.

Use the Dot Color picker to change the color of the finger position dots, the Text Color picker to change fret numbers and note names, and the Background Color picker to change the diagram background. Click the color swatch to open a color picker, or type a HEX code directly in the input field. Changes apply to the preview in real time.

When "Show Note Names" is enabled, the open string names (E, A, D, G, B, e) appear below the fretboard. This helps learners identify which strings they are playing and understand the relationship between the chord shape and the actual notes on the guitar. You can hide them by unchecking the option.

An open string is one that rings freely without pressing any fret — shown by a small circle above the nut. A muted string should not be played — shown by an "×" above the nut. For example, in a D major chord, the two lowest strings (low E and A) are muted because they are not part of the chord and would make it sound muddy if played.

The tool includes a built-in chord database. If your chord is not found, check the spelling: chord names are case-sensitive — the root note is uppercase (C, D, E, etc.) and modifiers are lowercase (m, maj7, sus4, add9). Flats use lowercase "b" (Bb, Eb, Ab) and sharps use "#" (F#m, C#). Try clicking one of the suggestion buttons to see example formats.

Yes — completely free with no sign-up required. All diagram generation happens entirely in your browser using JavaScript and SVG. No chord data, color preferences, or any other information is sent to a server. Your creative work stays on your device.

The diagrams are generated from your inputs entirely in-browser, so you own the output. You are free to use the downloaded SVG files in teaching materials, books, websites, apps, or any other project, commercial or personal. No attribution to ToolsZone is required, though it is always appreciated.