Skip to content

HDenizD/Real-OneDark-Pro

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

1,143 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

One Dark Pro Black

A dark, neutral personal fork of the iconic One Dark Pro theme for Visual Studio Code.

Fork notice & credits — This is a personal fork. The original theme, One Dark Pro, was created by Binaryify (zhuangtongfa) and its contributors — all credit for the theme belongs to them. The only change in this fork is one added variant, “One Dark Pro Black”, which replaces One Dark Pro's blue‑tinted backgrounds with a darker, neutral (no blue tint) background. Syntax colors, theme structure and the original variants are unchanged.

What's different

One Dark Pro builds its UI from a small constellation of blue‑tinted gray backgrounds (the editor is the lightest surface, chrome and borders go darker, hover/selection go lighter). One Dark Pro Black keeps that exact constellation but swaps every shade for a neutral, near‑black equivalent anchored at #0d0d0d:

Surface (role) One Dark Pro (blue‑tinted) One Dark Pro Black (neutral)
Editor & main chrome (lightest) #282c34 #0d0d0d
Peek result list #22262b #0c0c0c
Sidebar · status bar · tab bar · widgets · inactive tabs #21252b #0a0a0a
Input fields #1d1f23 #090909
Peek editor #1b1d23 #080808
Editor groups & borders (darkest) #181a1f #060606
Line highlight · list hover/selection #2c313a #161616
List focus · inactive selection · tab hover #323842 #1e1e1e

Only background colors change (42 of them). Every syntax/token color is identical to upstream One Dark Pro.

Try it in VS Code

This is the theme's source repository (it isn't published to the Marketplace). To use the theme in your own VS Code, pick one of the options below. The pre‑built theme files in themes/ are already committed, so no build step is required just to try it.

Option A — Quick test (Extension Development Host)

  1. Clone this repo and open the folder in VS Code.
  2. Press F5 (Run → “Start Debugging”). A second window titled “Extension Development Host” opens with the theme loaded.
  3. In that window open the theme picker — Ctrl/Cmd + K then Ctrl/Cmd + T — and choose One Dark Pro Black.

Option B — Install it for everyday use (.vsix)

# from the repo folder, once:
yarn                 # install dependencies
npm run package      # builds a .vsix using vsce

# then install the generated package (filename may vary):
code --install-extension material-theme-3.19.0.vsix

Or, in VS Code: open the Extensions view → menu → Install from VSIX… → select the .vsix. Then open the theme picker (Ctrl/Cmd + K Ctrl/Cmd + T) and choose One Dark Pro Black.

Option C — Drop it into your extensions folder (no packaging)

Copy (or symlink) the whole repo folder into your VS Code extensions directory, then reload VS Code:

  • macOS/Linux: ~/.vscode/extensions/
  • Windows: %USERPROFILE%\.vscode\extensions\

Then pick One Dark Pro Black from the theme picker.

Tip: You can also select it in settings.json with "workbench.colorTheme": "One Dark Pro Black".

Make it your own background color

The whole background ramp lives in one place: src/themes/data/oneDarkProBlack.ts. At the top you'll find eight named constants — bgEditor is the base color, the others are darker/lighter neutral steps around it:

const bgEditor = '#0d0d0d' // editor & main chrome (your base color)
const bgChrome = '#0a0a0a' // sidebar, status bar, widgets, inactive tabs
const bgBorder = '#060606' // editor groups & borders (darkest)
// …etc.

Change the values, then regenerate the theme file:

yarn build:theme   # rewrites themes/OneDark-Pro-black.json

Reload VS Code (or restart the Extension Development Host) to see the result.

Prefer not to touch the source? You can also override colors for just this theme from your own settings.json:

"workbench.colorCustomizations": {
  "[One Dark Pro Black]": {
    "editor.background": "#000000",
    "sideBar.background": "#080808"
  }
}

Build from source

yarn               # install dependencies
yarn build:theme   # generate the themes/*.json files

The theme variants are generated by scripts/generate-theme.ts from the data in src/themes/data/ plus the per‑variant config files in src/ (the black variant uses src/blackConfig.json). The generated artifacts live in themes/.

Credits

This fork is distributed under the same MIT License as the original (see LICENSE.txt).

Releases

Packages

Contributors

Languages