Thanks to visit codestin.com
Credit goes to brand.github.com

Skip to main content

Gitlines

Gitlines represent GitHub’s core collaborative functions commiting, merging, branching, and forking. Along each Gitline, there are solid or hollow nodes. Gitlines can be represented literally — as in, true to product UI — or modified to scale up or shift based on design and layout needs. We’ve even included them in paintings and illustrations.

A visual showing many of the available Gitlines in GitHub's illustration library.

Scaling detail

Gitlines are subtle elements that make our layouts more ownable. They should never be a central feature. Gitlines are primarily used as accents to help draw the eye to certain elements, and rarely are the main character of a composition.

At every scale of illustration, the Gitlines should have a consistent feeling thickness.

Two visuals side by side. the left visual shows a git line in an abstract visual, the right visual shows a git line launching a mascot into the air.

Usage

Like our shapes or hero illustrations, Gitlines should show up to reinforce the messaging and branding. Gitlines are a small ornamental detail, and shouldn’t show up in a distracting or attention grabbing way. Occasionally show up on their own as borders or edge treatment in low-branding situations, but more often should be used to accentuate the main subject of the visual.

An example of a powerpoint slide, showing a gitline surrounding a number claim.

Gitlines can be used to contour elements, to help accent the top layer of a shape.

An example of a large piece of background art. Ducky flies through the air over top of a set of abstract shapes.

Or Gitlines can be used to launch mascots into the air.

Two examples side by side. The left visual shows a git line launching Mona into the air, the right visual shows a git line launching Ducky into the air.