Quick Start

Get up and running with (neo) Git Graph in under 2 minutes

This guide will get you from installation to viewing your first Git graph and performing basic Git operations.

Opening Git Graph

There are three ways to open the Git Graph view:

Status Bar

Using the Status Bar

The quickest way to open Git Graph:

1. Locate the Icon

   Look for the Git Graph icon in the status bar at the bottom of VS Code

2. Click to Open

   Click the icon to open the Git Graph view

The status bar icon is enabled by default. If you don’t see it, check that neo-git-graph.showStatusBarItem is set to true in your settings.

Command Palette

Using the Command Palette

Open Git Graph via commands:

1. Open Command Palette

   Press Ctrl+Shift+P (Windows/Linux) or Cmd+Shift+P (macOS)

2. Search for Command

   Type Git Graph: View Git Graph or just git graph

3. Execute Command

   Press Enter to open the view

Keyboard Shortcut

Create a Keyboard Shortcut

For fastest access, create a custom keybinding:

1. Open Keyboard Shortcuts

   Press Ctrl+K Ctrl+S (Windows/Linux) or Cmd+K Cmd+S (macOS)

2. Search for Command

   Search for neo-git-graph.view

3. Assign Keybinding

   Click the + icon and assign your preferred shortcut (e.g., Ctrl+Alt+G)

Understanding the Interface

Once opened, the Git Graph view displays several key components:

Control Panel

At the top of the view:

• Repo Selector: Switch between repositories in a multi-root workspace
• Branch Selector: Filter commits by branch (or view all branches)
• Show Remote Branches: Toggle visibility of remote branches
• Refresh Button: Reload the graph to see latest changes

Graph View

The main visualization shows:

• Colored Lines: Each branch has a unique color
• Commit Dots: Individual commits along the timeline
• Branch Labels: Current branch names and tags
• Uncommitted Changes: Special node showing working directory changes (if enabled)

Commit Table

Next to the graph, see:

• Commit Message: First line of the commit message
• Author: Person who authored the commit
• Date: When the commit was created
• Commit Hash: Abbreviated SHA-1 hash

Your First Actions

View Commit Details

1. Click a Commit

   Click any commit in the graph or table

2. Explore Details Panel

   The commit details panel shows:

   • Full commit message
   • Author and committer information
   • List of changed files
   • Available actions (checkout, cherry-pick, etc.)
3. View File Diff

   Click any file in the changed files list to see a side-by-side diff

Switch Branches

1. Open Branch Selector

   Click the Branch dropdown in the control panel

2. Choose a Branch

   Select the branch you want to view or checkout

3. View Branch History

   The graph updates to show commits for the selected branch

Enable Show Remote Branches to see remote tracking branches in the branch selector.

Create a New Branch

1. Right-Click a Commit

   Right-click the commit where you want to create a branch

2. Select Create Branch

   Choose Create Branch… from the context menu

3. Name Your Branch

   Enter a branch name in the dialog and press Enter

4. Confirm Creation

   The new branch appears in the graph with a label at the selected commit

Common Operations

Context Menu Actions

Right-click any commit to access:

Branch Operations

Create Branch...
Checkout Branch
Rename Branch...
Delete Branch...
Merge into Current Branch...

View Uncommitted Changes

By default, uncommitted changes appear as a special node:

1. Locate Uncommitted Node

   Look for the “Uncommitted Changes” entry at the top of the graph

2. Click to View

   Click it to see all modified, added, and deleted files

3. Inspect Changes

   Click individual files to see diffs against HEAD

You can disable uncommitted changes by setting neo-git-graph.showUncommittedChanges to false. This can improve performance on large repositories.

Load More Commits

For repositories with long histories:

1. Scroll to Bottom

   Scroll to the bottom of the commit table

2. Click Load More

   If more commits are available, click the Load More Commits button

3. View Extended History

   Additional commits are loaded and added to the graph

Configuration Tips

Customize your experience with these popular settings:

settings.json

{
  // Initial commits to load (default: 300)
  "neo-git-graph.initialLoadCommits": 500,
  
  // Show only current branch when opening
  "neo-git-graph.showCurrentBranchByDefault": true,
  
  // Date display format
  "neo-git-graph.dateFormat": "Relative",
  
  // Graph style preference
  "neo-git-graph.graphStyle": "rounded",
  
  // Auto-center commit details panel
  "neo-git-graph.autoCenterCommitDetailsView": true,
  
  // Enable avatar fetching (sends emails to external services)
  "neo-git-graph.fetchAvatars": true
}

Enabling fetchAvatars will send commit author and committer email addresses to GitHub, GitLab, or Gravatar depending on your repository’s remote origin.

Customize Graph Colors

Change the branch line colors:

settings.json

{
  "neo-git-graph.graphColours": [
    "#0085d9",
    "#d9008f",
    "#00d90a",
    "#d98500",
    "#a300d9",
    "#ff0000",
    "#00d9cc",
    "#e138e8",
    "#85d900",
    "#dc5b23",
    "#6f24d6",
    "#ffcc00"
  ]
}

Colors can be specified as HEX codes (#RRGGBB or #RRGGBBAA) or RGB values (rgb(r, g, b)).

Working with Multiple Repositories

If your workspace contains multiple Git repositories:

1. Open Repo Selector

   Click the Repo dropdown in the control panel

2. Choose Repository

   Select the repository you want to view

3. Switch Seamlessly

   The graph updates to show the selected repository’s history

Use neo-git-graph.maxDepthOfRepoSearch to control how deep VS Code searches for Git repositories in your workspace. Default is 0 (only top-level folders).

Troubleshooting

Graph Won’t Load

If you see “Unable to load Git Graph”:

1. Verify Git Installation: Run git --version in the terminal
2. Check Repository: Ensure you’re in a valid Git repository (git status)
3. Configure Git Path: For portable Git, set git.path in VS Code settings:

settings.json

{
  "git.path": "C:\\Program Files\\Git\\bin\\git.exe"
}

Performance Issues

For large repositories:

settings.json

{
  // Reduce initial commit load
  "neo-git-graph.initialLoadCommits": 100,
  
  // Disable uncommitted changes
  "neo-git-graph.showUncommittedChanges": false,
  
  // Disable avatar fetching
  "neo-git-graph.fetchAvatars": false
}

Clear Avatar Cache

If avatars appear corrupted:

1. Open Command Palette

   Press Ctrl+Shift+P or Cmd+Shift+P

2. Run Clear Command

   Type and select Git Graph: Clear Avatar Cache

3. Refresh Graph

   Click the Refresh button to reload avatars

Next Steps

Now that you’re familiar with the basics:

Configuration Guide

Explore all available settings and customization options

Features Overview

Learn about advanced features and Git operations