Skip to content

Navigation - Add option to change navigation color palette

Resources

FE @annabeldunstone

Description

Previous versions of GitLab allowed users to customize the navigation sidebar with a color theme. This was an appreciated feature, and users could also use color to differentiate GitLab instances.

With the change to our new navigation, we have a chance to bring back this feature. Our default palette is an indigo one, based on the GitLab identity, but we should allow users to choose from a variety of themes.

These themes should be mindful of our current use of color as to not diminish its meaning and intention (e.g. red is used for destructive actions.)

Proposal

Check all design variations and specs (for implementation notes, spacing, sizes, colors and text copying)

Revert !9199 (merged) and apply the following changes and colors:

For the Preferences screen, show the theme options in the same style as the syntax highlighting themes, with the following description: Customize the appearance of the application header and navigation sidebar.

35012__navigation-color-palette-settings

For the squares, use the values specified in the following tables:


Indigo
$indigo-900 $indigo-700
$indigo-800 $indigo-500

Dark
$grey-900 $grey-800
#3b3b3b $grey-700

Light
$grey-700 #e6e6e6
$grey-300 $grey-100

Blue
#1a3652 #305c88
#25496e #25496E

Green
#0d4524 #1c7441
#145d33 #35935c
Indigo (default) Dark Light Blue Green
indigo dark light blue green
Edited by Chris Peressini