# @codemirror/theme-one-dark

> One Dark theme for the CodeMirror code editor

Latest version **6.1.3** (published 2025-06-19) · MIT license · 0 weekly downloads

## Install

```sh
npm install @codemirror/theme-one-dark
pnpm add @codemirror/theme-one-dark
yarn add @codemirror/theme-one-dark
bun add @codemirror/theme-one-dark
```

## Health

**Score 50/100 (C)** — status: stable.

Positive: has types; esm support; no vulnerabilities; high quality score.

Warnings: low downloads.

Negative: stale.

## Facts

| | |
|---|---|
| Version | 6.1.3 |
| Published | 2025-06-19 |
| First published | 2020-12-29 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 4 |
| Unpacked size | 19.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 82 |
| Author | Marijn Haverbeke |
| Maintainers | adrianheine, marijn |
| Keywords | editor, code |

## Links

- npm: https://www.npmjs.com/package/@codemirror/theme-one-dark
- Repository: https://github.com/codemirror/theme-one-dark
- Homepage: https://github.com/codemirror/theme-one-dark#readme
- Issues: https://github.com/codemirror/theme-one-dark/issues
- npm.io page: https://npm.io/package/@codemirror/theme-one-dark

## Dependencies (4)

- [@codemirror/view](https://npm.io/package/@codemirror/view.md) ^6.0.0
- [@lezer/highlight](https://npm.io/package/@lezer/highlight.md) ^1.0.0
- [@codemirror/state](https://npm.io/package/@codemirror/state.md) ^6.0.0
- [@codemirror/language](https://npm.io/package/@codemirror/language.md) ^6.0.0

## Alternatives

- [flatbuffers](https://npm.io/package/flatbuffers.md) — 6.0M weekly downloads
- [jwt-simple](https://npm.io/package/jwt-simple.md) — 259.5K weekly downloads
- [@exodus/patch-broken-hermes-typed-arrays](https://npm.io/package/@exodus/patch-broken-hermes-typed-arrays.md) — 28.5K weekly downloads
- [@native-to-anchor/buffer-layout](https://npm.io/package/@native-to-anchor/buffer-layout.md) — 12.2K weekly downloads
- [binary-parser-encoder](https://npm.io/package/binary-parser-encoder.md) — 5.3K weekly downloads

## Recent versions

- 6.1.3 (latest) — 2025-06-19
- 6.1.2 — 2023-04-17
- 6.1.1 — 2023-02-17
- 6.1.0 — 2022-09-12
- 6.0.0 — 2022-06-08
- 0.20.0 — 2022-04-20
- 0.19.1 — 2021-11-06
- 0.19.0 — 2021-08-11
- 0.18.1 — 2021-05-15
- 0.18.0 — 2021-03-03
- 0.17.5 — 2021-02-10
- 0.17.4 — 2021-01-18
- 0.17.3 — 2021-01-14
- 0.17.2 — 2021-01-06
- 0.17.1 — 2021-01-03
- … 1 more at https://npm.io/package/@codemirror/theme-one-dark/versions

## README

<!-- NOTE: README.md is generated from src/README.md -->

# @codemirror/theme-one-dark [![NPM version](https://img.shields.io/npm/v/@codemirror/theme-one-dark.svg)](https://www.npmjs.org/package/@codemirror/theme-one-dark)

[ [**WEBSITE**](https://codemirror.net/) | [**ISSUES**](https://github.com/codemirror/dev/issues) | [**FORUM**](https://discuss.codemirror.net/c/next/) | [**CHANGELOG**](https://github.com/codemirror/theme-one-dark/blob/main/CHANGELOG.md) ]

This package implements the One Dark theme for the
[CodeMirror](https://codemirror.net/) code editor.

The [project page](https://codemirror.net/) has more information, a
number of [examples](https://codemirror.net/examples/) and the
[documentation](https://codemirror.net/docs/).

This code is released under an
[MIT license](https://github.com/codemirror/theme-one-dark/tree/main/LICENSE).

We aim to be an inclusive, welcoming community. To make that explicit,
we have a [code of
conduct](http://contributor-covenant.org/version/1/1/0/) that applies
to communication around the project.

## API Reference

<dl>
<dt id="user-content-onedark">
  <code><strong><a href="#user-content-onedark">oneDark</a></strong>: <a href="https://codemirror.net/docs/ref#state.Extension">Extension</a></code></dt>

<dd><p>Extension to enable the One Dark theme (both the editor theme and
the highlight style).</p>
</dd>
<dt id="user-content-onedarktheme">
  <code><strong><a href="#user-content-onedarktheme">oneDarkTheme</a></strong>: <a href="https://codemirror.net/docs/ref#state.Extension">Extension</a></code></dt>

<dd><p>The editor theme styles for One Dark.</p>
</dd>
<dt id="user-content-onedarkhighlightstyle">
  <code><strong><a href="#user-content-onedarkhighlightstyle">oneDarkHighlightStyle</a></strong>: <a href="https://codemirror.net/docs/ref#language.HighlightStyle">HighlightStyle</a></code></dt>

<dd><p>The highlighting style for code in the One Dark theme.</p>
</dd>
<dt id="user-content-color">
  <code><strong><a href="#user-content-color">color</a></strong>: {chalky: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a>, coral: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a>, cyan: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a>, invalid: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a>, ivory: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a>, stone: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a>, malibu: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a>, sage: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a>, whiskey: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a>, violet: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a>, darkBackground: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a>, highlightBackground: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a>, background: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a>, tooltipBackground: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a>, selection: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a>, cursor: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a>}</code></dt>

<dd><p>The colors used in the theme, as CSS color strings.</p>
</dd>
</dl>

---
_Source: https://npm.io/package/@codemirror/theme-one-dark · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._