# One Dark Pro ships nine colour variants but only one customisable

> One Dark Pro is a Visual Studio Code colour theme built from SCSS sources and a generation script, published to the marketplace under the package name material-theme. Its variants share one palette, and its own settings screen only applies to the default theme, which is the constraint most users hit first.

**Binaryify/OneDark-Pro** — Atom's iconic One Dark theme for Visual Studio Code

- Repository: https://github.com/Binaryify/OneDark-Pro
- Website: https://marketplace.visualstudio.com/items?itemName=zhuangtongfa.Material-theme
- Stars: 1,805 · Forks: 308
- Language: TypeScript
- License: MIT
- Published: 2026-10-16 · Updated: 2026-10-16 · Language: en
- Canonical page: https://hysenlabs.com/projects/binaryify-onedark-pro

## Nine variants, one default, and a setting that only reaches the default

The README walks through nine screenshots in sequence: the normal view, an italic variant, then the named themes Default, Flat, Darker, Night Flat, Retro and Gnome, followed by the terminal colours. So the extension is not one palette but a family built around the same dark base.

Then the sentence that decides most people's experience:

```
Setting only support default theme(One Dark Pro).
```

Open the settings UI while Flat or Darker is active and the options are inert. The theme customisation entry points work only against the default theme. That is a deliberate simplification in the extension code, not a user mistake, and it means a team that standardises on Darker or Night Flat has to do its palette work through token rules instead of the settings screen.

The italic variant is worth separating from the rest, because it is not a separate theme in that list. It is produced by a fontStyle rule applied to a long list of TextMate scopes in settings.json, which the README spells out in full, from comment and keyword through keyword.control.trycatch, storage.type.function and variable.language.super.

## The build is SCSS, then a generation script, then TypeScript

The source is not a hand-written colour scheme. package.json shows a three-stage build, and the stage names say what each one does:

```
npm run build:sass && npm run build:theme && npm run build:ts
```

build:sass runs the sass compiler twice with --no-source-map, once from scss to styles and once from scss to styles/origin. The repository top level holds scss/ and themes/ directories, so the palettes live in Sass sources and the generated output goes to styles. build:theme then runs generate-theme.ts through tsx with scripts/tsconfig.json, which is the step that turns the compiled styles into the JSON colour theme VS Code consumes. build:ts compiles src with the TypeScript native compiler.

There is a matching watch mode. watch:theme runs nodemon on scripts/generate-theme.ts and watch:ts passes -w to build:ts, so a contributor editing a palette sees both the Sass output and the theme JSON refresh.

That pipeline has a consequence for contributors. Changing one colour means editing SCSS, recompiling, and letting the generator rebuild the theme file, rather than editing a JSON file directly.

## Two settings keys do the customisation, and they work at different levels

The README documents two extension points. workbench.colorCustomizations paints the editor chrome, and editor.tokenColorCustomizations repaints tokens. The first example sets four keys under a single theme name:

```json
"workbench.colorCustomizations": {
  "tab.activeBackground": "#282c34",
  "activityBar.background": "#282c34",
  "sideBar.background": "#282c34",
  "tab.activeBorder": "#d19a66"
}
```

Note that the key is unscoped there, so it applies to whichever theme is active, and the README frames it as the way to play with colours on top of the currently selected theme.

The second example scopes the rules to the default theme by name, and shows the TextMate rule structure with a scope array and a settings object:

```json
"editor.tokenColorCustomizations": {
  "[One Dark Pro]": {
    "textMateRules": [
      {
        "scope": ["source.python"],
        "settings": {
          "foreground": "#e06c75"
        }
      }
    ]
  }
}
```

Scoping to "[One Dark Pro]" is also a way to work around the default-theme-only limitation: rules written under that key apply when the default variant is selected.

## Python colouring goes through semantic tokens, not TextMate scopes

There is a separate section for Python and Pylance users, and it uses a different settings key entirely: editor.semanticTokenColorCustomizations. The section opens by recommending the Pylance extension for fast language support, then explains that semantic colours can be associated with Pylance semantic token types and modifiers.

The listed token types are class, enum, parameter, variable, property, enumMember, function, member, module, intrinsic, magicFunction for dunder methods, and selfParameter and clsParameter. The modifiers are declaration, readonly, static, abstract, async, typeHint, typeHintComment, decorator and builtin.

The example maps a few of those to colours, with the comment noting the block applies to this theme only:

```jsonc
{
  "editor.semanticTokenColorCustomizations": {
    "[One Dark Pro]": {
      // Apply to this theme only
      "enabled": true,
      "rules": {
        "magicFunction:python": "#ee0000",
        "function.declaration:python": "#990000",
        "*.decorator:python": "#0000dd",
        "*.typeHint:python": "#5500aa",
        "*.typeHintComment:python": "#aaaaaa",
        "parameter:python": "#aaaaaa"
      }
    }
  }
}
```

For anyone whose Python looks wrong under a dark theme, this is the section that matters, and the README points at VS Code's scope inspector tool for finding which tokens a file actually emits.

## The marketplace identity does not match the GitHub name

Anyone scripting an install will trip over this. package.json declares name material-theme, publisher zhuangtongfa and displayName One Dark Pro, while the repository, the documentation site and the marketplace link all refer to One Dark Pro. The extension identifier on the marketplace is zhuangtongfa.Material-theme, which is the string the README uses in its links.

So a Git clone of Binaryify/OneDark-Pro does not produce a package named One Dark Pro in npm terms. Anyone writing setup automation has to use the publisher and name pair from the marketplace listing rather than the repository name.

Two other fields matter for adoption. engines requires vscode ^1.76.0, which is the hard floor. activationEvents is onStartupFinished and main points at ./out/extension.js, with a separate browser entry at ./out/web/extension.js and a separate webpack configuration for the web build, so the theme also runs in browser-based VS Code.

## Serving the documentation locally

The docs are a docsify site in the docs/ directory, and the README gives the contributor path in three steps: fork and clone the repository, cd into the OneDark-Pro folder, then run npm install. After that, npm run docs serves the documentation locally at localhost:3000.

package.json confirms the mechanism, with docs mapped to docsify serve docs.

```
npm run docs
```

Two version numbers sit apart from each other in this repository. The extension version is 3.20.3, matching the 3.20.3 release published on 2026-10-08 and preceded by 3.20.2 and 3.20.1 in August 2026. The last push was on 2026-10-08 as well, and the project keeps a CHANGELOG.md, a renovate.json for dependency updates, and an eslint config for the TypeScript sources.

## Conclusion

One Dark Pro is a good default for teams that want a dark editor with a consistent palette across nine variants, and a poor fit for anyone who wants a heavily customised syntax palette, because the README states that settings only support the default theme and the semantic token customisation is Python and Pylance specific. Before adopting it, check the one hard requirement in package.json, engines.vscode of ^1.76.0, and confirm your editors are on that line or newer, because the extension will not activate on older builds.

## FAQ

### How do I customise the colours in One Dark Pro?

The README documents two settings keys: workbench.colorCustomizations for editor chrome such as tab.activeBackground, and editor.tokenColorCustomizations for tokens through TextMate rules. Both are set in your settings.json.

### Can I customise the Flat or Darker variants?

The README states that setting only support the default theme, One Dark Pro. Rules written under a theme-scoped key such as "[One Dark Pro]" apply when the default variant is active.

### What Visual Studio Code version does One Dark Pro require?

package.json declares engines.vscode of ^1.76.0. The extension activates on onStartupFinished and ships both a desktop entry at ./out/extension.js and a web entry at ./out/web/extension.js.

### How do I run the One Dark Pro documentation site locally?

Fork and clone the repository, cd into the OneDark-Pro folder and run npm install, then run npm run docs. The README states the site is then served locally at localhost:3000.

## Sources

- [Binaryify/OneDark-Pro on GitHub](https://github.com/Binaryify/OneDark-Pro)
- [License: MIT](https://github.com/Binaryify/OneDark-Pro/blob/master/LICENSE)
- [Project website](https://marketplace.visualstudio.com/items?itemName=zhuangtongfa.Material-theme)
- [README](https://github.com/Binaryify/OneDark-Pro/blob/master/README.md)
- [Releases](https://github.com/Binaryify/OneDark-Pro/releases)

---

Hysen Labs editorial analysis, written from the project's own repository and release notes. Cite the canonical page: https://hysenlabs.com/projects/binaryify-onedark-pro