How can the editor color scheme in the GitLab web IDE be changed?

2.2k views Asked by At

I want to use a dark theme in the GitLab web IDE, but the options related to color schemes in the user settings don't affect the editor theme. Is there currently a way to change this? If not, will it be added in a future release?

3

There are 3 answers

0
VonC On BEST ANSWER

Update GitLab 13.0, May 2020:

Dark Theme in the Web IDE

For people who spend time working in code editors, the ability to customize the environment to match their preferences is important. Dark themes are some of the most popular for other editors and important for providing a comfortable experience. It’s also clear that GitLab users love their dark themes as a Dark Application theme for all of GitLab is the second most popular request in the GitLab Issue Tracker.

The GitLab Web IDE is now completely themed dark for users who choose the Dark syntax highlighting theme preference.

This is an important step in delivering an editing experience users love and a valuable step in understanding how the GitLab UI responds to dark themes. You can read more about the design process here.

See documentation and issue.

And, still with GitLab 13.0:

Syntax Highlighting Themes for the Web IDE

GitLab supports six syntax highlighting preferences when viewing code.

Themes are important to developers when viewing and editing code on GitLab since it’s imperative that they work comfortably throughout the day.

We’ve now released support for all six syntax highlighting preferences in the Web IDE.
This includes:

https://about.gitlab.com/images/13_0/phikai-webide-themes.png

Over the last few releases (for example, 12.8 and 12.9) we’ve been steadily adding and improving support for syntax highlighting preferences in the Web IDE.
These updates follow this effort and help to lay the foundation for our Dark Theme in the Web IDE, also launching in 13.0.
We’re excited to continue to expand on developer experience and making the Web IDE feel more like home.

Over the last few releases (for example, 12.8 and 12.9) we’ve been steadily adding and improving support for syntax highlighting preferences in the Web IDE. These updates follow this effort and help to lay the foundation for our Dark Theme in the Web IDE, also launching in 13.0. We’re excited to continue to expand on developer experience and making the Web IDE feel more like home.

See documentation and Epic.


Original answer:

If not, will it be added in a future release?

Feb. 2020 might be that future release date, with GitLab 12.8

See "Dark syntax highlighting theme for Web IDE"

GitLab has long supported alternative syntax highlighting themes for use when browsing files in the repository or viewing diffs during the code review process.

However, our code editor areas have not supported the use of this preference despite being the most requested feature for the Web IDE.
(issue 195701)

The Web IDE now supports the Dark syntax highlighting preference in the code area.
We’ve started with this theme, as it’s the most widely used one beyond our default, but we’ll continue to expand our support for syntax highlighting preferences on the Web IDE.

We’ll also be working on expanding the dark theme to the rest of the Web IDE, including the file tree and sidebars.

dark Web IDE -- https://about.gitlab.com/images/12_8/phikai-dark-syntax-webide.png

See documentation.


With GitLab 15.10 (March 2023)

Default syntax highlighting theme for new users

Set the syntax highlighting theme shown to new users, or users who are viewing code but not signed in.

Previously, the default only applied to signed-in users, causing signed-out users to sometimes see a visual clash between dark and light theme highlighting.

Thank you Colin Berry for your contribution!

See Documentation and Issue.

0
PStarczewski On

For now only Navigation and Syntax theme customizations are available, as stated in here: GitLab IDE

I don't think there is anything about customizations in upcoming patches, as new UI was presented about year ago.

1
Justin Cann On

You can use a tool like Stylish for Chrome or Firefox. This is the dark theme that I use Dark-Gitlab.

This will alter how GitLab appears in your browser.