Package detail

@fsegurai/codemirror-theme-tokyo-night-storm

fsegurai12kMIT6.2.3

Tokyo Night Storm theme for the CodeMirror editor

editor, diff, diff-editor, code

readme

CodeMirror 6 Themes Logo

Test Status Latest Release
GitHub contributors Dependency status for repo GitHub License
Stars Forks

A library of custom themes for CodeMirror 6.

@fsegurai/codemirror-theme-tokyo-night-storm is a theme for CodeMirror 6 editor, making it visually engaging and adaptable to different coding styles and user preferences.

Table of contents

Installation

@fsegurai/codemirror-theme-tokyo-night-storm

To add @fsegurai/codemirror-theme-tokyo-night-storm along with CodeMirror 6 to your package.json use the following commands.

bun install @fsegurai/codemirror-theme-tokyo-night-storm codemirror@^6.0.0 --save

Using Theme

Import the respective theme from the package and apply it to your CodeMirror instance as shown below.

import { EditorView, basicSetup } from 'codemirror'
import { markdown } from '@codemirror/lang-markdown'
import { tokyoNightStorm } from '@fsegurai/codemirror-theme-tokyo-night-storm'

let editor = new EditorView({
  doc: '# Hello World',
  extensions: [
    basicSetup,
    markdown(),
    tokyoNightStorm
  ],
  parent: document.body
})

Read the CodeMirror documentation for more details about themes.

Available Themes

Theme Package Version
All - Bundle @fsegurai/codemirror-theme-bundle npm
Abcdef @fsegurai/codemirror-theme-abcdef npm
Abyss @fsegurai/codemirror-theme-abyss npm
Android Studio @fsegurai/codemirror-theme-android-studio npm
Andromeda @fsegurai/codemirror-theme-andromeda npm
Basic Dark @fsegurai/codemirror-theme-basic-dark npm
Basic Light @fsegurai/codemirror-theme-basic-light npm
Catppuccin Mocha @fsegurai/codemirror-theme-catppuccin-mocha npm
Cobalt2 @fsegurai/codemirror-theme-cobalt npm
Forest @fsegurai/codemirror-theme-forest npm
GitHub Dark @fsegurai/codemirror-theme-github-dark npm
GitHub Light @fsegurai/codemirror-theme-github-light npm
Gruvbox Dark @fsegurai/codemirror-theme-gruvbox-dark npm
Gruvbox Light @fsegurai/codemirror-theme-gruvbox-light npm
High Contrast Dark @fsegurai/codemirror-theme-high-contrast-dark npm
High Contrast Light @fsegurai/codemirror-theme-high-contrast-light npm
Material Dark @fsegurai/codemirror-theme-material-dark npm
Material Light @fsegurai/codemirror-theme-material-light npm
Monokai @fsegurai/codemirror-theme-monokai npm
Nord @fsegurai/codemirror-theme-nord npm
Palenight @fsegurai/codemirror-theme-palenight npm
Solarized Dark @fsegurai/codemirror-theme-solarized-dark npm
Solarized Light @fsegurai/codemirror-theme-solarized-light npm
Synthwave 84 @fsegurai/codemirror-theme-synthwave-84 npm
Tokyo Night Day @fsegurai/codemirror-theme-tokyo-night-day npm
Tokyo Night Storm @fsegurai/codemirror-theme-tokyo-night-storm npm
Volcano @fsegurai/codemirror-theme-volcano npm
VS Code Light @fsegurai/codemirror-theme-vscode-light npm
VS Code Dark @fsegurai/codemirror-theme-vscode-dark npm

Demo Application

To see all themes in action, check out the demo: https://fsegurai.github.io/codemirror-themes.

To set up the demo locally:

git clone https://github.com/fsegurai/codemirror-themes.git
bun install
bun start

This will serve the application locally at http://[::1]:8000.

License

Licensed under MIT.

changelog

📦 Changelog

All notable changes to this project will be documented in this file. This project adheres to Keep a Changelog

Unreleased

No changes have been made yet.

6.29.0 - 2025-12-02

⚠️ BREAKING CHANGES ⚠️

  • Theme Declaration: Changed VS Code theme declaration to be more consistent with the rest of the themes.
    • Visual Studio Code Dark Theme from vsCodeDark to vscodeDark
    • Visual Studio Code Light Theme from vsCodeLight to vscodeLight

🚀 Features

  • New Theme: Added a new catppuccin-mocha theme to the collection.
  • New Theme: Added a new high-contrast-dark theme to the collection.
  • New Theme: Added a new high-contrast-light theme to the collection.
  • New Theme: Added a new synthwave-84 theme to the collection.

🐞 Fixes

  • For rollout configuration file, fixed process import reference to point to node:process directly.
  • Fixed inconsistent line-height between editor content and line numbers across all themes. Line numbers now properly align with their corresponding code rows.
    • Comparison 1
    • Comparison 2

🔧 Changes

  • Refactored the local storage theme keyword to a more accurate one based on the project.
  • Improved keywords declared in the package.json files.

🔐 Security

  • Update dependencies — address potential vulnerabilities and/or improvements in development dependencies.
    • Dependencies
      • @codemirror/lang-markdown from 6.3.4 to 6.5.0
      • @codemirror/language from 6.11.2 to 6.11.3
      • @codemirror/language-data from 6.5.1 to 6.5.2
      • @codemirror/legacy-modes from 6.5.1 to 6.5.2
      • @codemirror/merge from 6.10.2 to 6.11.2
      • @lezer/markdown from 1.4.3 to 1.6.0
      • @material/web from 2.3.0 to 2.4.1
      • marked from 16.1.2 to 17.0.1
      • marked-highlight from 2.2.2 to 2.2.3
    • Dev Dependencies
      • @eslint/js from 9.33.0 to 9.39.1 -@rollup/plugin-commonjs from 28.0.6 to 29.0.0
      • @rollup/plugin-node-resolve from 16.0.1 to 16.0.3
      • @rollup/plugin-replace from 6.0.2 to 6.0.3
      • @rollup/plugin-typescript from 12.1.4 to 12.3.0
      • @semantic-release/release-notes-generator from 14.0.3 from 14.1.0
      • cpy-cli from 5.0.0 to 6.0.0
      • dotenv from 17.2.1 to 17.2.3
      • eslint from 9.33.0 to 9.39.1
      • globals from 16.3.0 to 16.5.0
      • rimraf from 6.0.1 to 6.1.2
      • rollup from 4.46.2 to 4.53.3
      • semantic-release from 24.2.7 to 25.0.2
      • typescript from 5.9.2 to 5.9.3
      • typescript-eslint from 8.39.1 to 8.48.0
  • Removed dependencies — removed unused dependencies.
    • Dev Dependencies
      • Removed prettier dependency.
      • Removed ts-node dependency.

Full Changelog: https://github.com/fsegurai/codemirror-themes/commits/v6.29.0

6.25.0 - 2025-08-11

🚀 Features

  • New Theme: Added a new cobalt2 theme to the collection.
  • Utils Declaration: Added new utils scripts for better propagation across themes.
  • Improved overall project documentation, including CHANGELOG.md and CONTRIBUTING.md.

🐞 Fixes

  • Improved demo playground and logic.
  • Refined overall themes structure styles.

🔧 Changes

  • Enhanced helper utilities for easier theme development and testing.
  • Removed unused methods from the rollup configuration.
  • Refactored demo playground for better usability and maintainability.
  • Updated all package README.md files to include the new theme.

⚡ Performance

  • Upgraded libraries to the latest versions.

Full Changelog: https://github.com/fsegurai/codemirror-themes/commits/v6.25.0

6.24.0 - 2025-06-02

🚀 Features

  • Utils Declaration: Added utils declaration across themes.
  • Editor Support: Added theme support for diff editor and unified editor.

🔧 Changes

  • Improved demo playground and logic.
  • Enhanced package keywords reference.
  • Refined overall themes, structure styles, and documentation for a better visualization and usability.

⚡ Performance

  • Upgraded libraries to the latest versions.

Full Changelog: https://github.com/fsegurai/codemirror-themes/commits/v6.24.0

6.1.4.0 - 2025-04-22

🐞 Fixes

  • Minor fixes and improvements.

⚡ Performance

  • Upgraded libraries to the latest versions.

Full Changelog: https://github.com/fsegurai/codemirror-themes/commits/v6.1.4.0

6.1.3.8 - 2025-03-02

🐞 Fixes

  • Fixed release setup files.

🔧 Changes

  • Improved project README.

⚡ Performance

  • Upgraded libraries to the latest versions.

Full Changelog: https://github.com/fsegurai/codemirror-themes/commits/v6.1.3.8

6.1.3.7 - 2025-02-16

⚡ Performance

  • Upgraded libraries to the latest versions.

Full Changelog: https://github.com/fsegurai/codemirror-themes/commits/v6.1.3.7

6.1.3.6 - 2025-02-14

🐞 Fixes

  • Fixed release setup files.

Full Changelog: https://github.com/fsegurai/codemirror-themes/commits/v6.1.3.6

6.1.3.5 - 2025-02-04

🐞 Fixes

  • Fixed release setup files.

Full Changelog: https://github.com/fsegurai/codemirror-themes/commits/v6.1.3.5

6.1.3.4 - 2025-02-02

🐞 Fixes

  • Fixed release setup files.

🔧 Changes

  • Improved bundle theme packages versioning.

⚡ Performance

  • Upgraded libraries to the latest versions.

Full Changelog: https://github.com/fsegurai/codemirror-themes/commits/v6.1.3.4

6.1.3.3 - 2025-01-13

🔧 Changes

  • Migrated workflows package manager to Bun.js.

⚡ Performance

  • Upgraded libraries to the latest versions.

Full Changelog: https://github.com/fsegurai/codemirror-themes/commits/v6.1.3.3

6.1.3.2 - 2024-11-26

🔧 Changes

  • Improved header theme local storage reference.
  • Improved index logic.

⚡ Performance

  • Upgraded libraries to the latest versions.

Full Changelog: https://github.com/fsegurai/codemirror-themes/commits/v6.1.3.2

6.1.3.1 - 2024-11-22

🚀 Features

  • Added code block clipboard and highlight.

🔧 Changes

  • Improved README, pipelines, and styles.
  • Enhanced project structure.

Full Changelog: https://github.com/fsegurai/codemirror-themes/commits/v6.1.3.1

6.1.3.0 - 2024-11-15

🐞 Fixes

  • Fixed local links redirect due to host URL.
  • Fixed header current URL validation.

🔧 Changes

  • Refactored demo project.

Full Changelog: https://github.com/fsegurai/codemirror-themes/commits/v6.1.3.0

6.1.0.0 - 2024-11-12

🚀 Features

  • New Theme: Added a new palenight theme to the collection.
  • New Theme: Added a new vscode-light theme to the collection.
  • New Theme: Added a new vscode-dark theme to the collection.

🔧 Changes

  • Improved README files.

Full Changelog: https://github.com/fsegurai/codemirror-themes/commits/v6.1.0.0

6.0.3 - 2024-11-11

🚀 Features

  • Added ESLint support.

🐞 Fixes

  • Fixed demo pipeline issues.

🔧 Changes

  • Improved pipelines workflows and README.
  • Enhanced library release pipeline and dependencies.

Full Changelog: https://github.com/fsegurai/codemirror-themes/commits/v6.0.3

1.3.2 - 2024-10-23

🐞 Fixes

  • Fixed README.

🔧 Changes

  • Updated pipelines and gitignore files.

Full Changelog: https://github.com/fsegurai/codemirror-themes/commits/v1.3.2

1.3.1 - 2024-10-21

🚀 Features

  • Added Dependabot actions file.

🐞 Fixes

  • Fixed demo deployment pipeline.
  • Fixed npm publish pipeline.

⚡ Performance

  • Upgraded libraries to the latest versions.

Full Changelog: https://github.com/fsegurai/codemirror-themes/commits/v1.3.1

1.2.2 - 2024-06-11

🔧 Changes

  • Improved main package file.
  • Updated demo pipeline setup.

Full Changelog: https://github.com/fsegurai/codemirror-themes/commits/v1.2.2

1.2.0 - 2024-05-21

🚀 Features

  • New Theme: Added a new bundle theme to the collection.

🔧 Changes

  • Improved selection styles.

Full Changelog: https://github.com/fsegurai/codemirror-themes/commits/v1.2.0

1.1.1 - 2024-04-30

🐞 Fixes

  • Fixed packages README.

Full Changelog: https://github.com/fsegurai/codemirror-themes/commits/v1.1.1

1.1.0 - 2024-04-29

🚀 Features

  • Added demo pipeline setup.
  • Created reference to the demo website.

Full Changelog: https://github.com/fsegurai/codemirror-themes/commits/v1.1.0

1.0.0 - 2024-04-29

🚀 Features

  • Added 20 new themes for CodeMirror version 6.
  • New Theme: Added a new abcdef theme to the collection.
  • New Theme: Added a new abyss theme to the collection.
  • New Theme: Added a new android-studio theme to the collection.
  • New Theme: Added a new andromeda theme to the collection.
  • New Theme: Added a new basic-dark theme to the collection.
  • New Theme: Added a new basic-light theme to the collection.
  • New Theme: Added a new forest theme to the collection.
  • New Theme: Added a new github-dark theme to the collection.
  • New Theme: Added a new github-light theme to the collection.
  • New Theme: Added a new gruvbox-dark theme to the collection.
  • New Theme: Added a new gruvbox-light theme to the collection.
  • New Theme: Added a new material-dark theme to the collection.
  • New Theme: Added a new material-light theme to the collection.
  • New Theme: Added a new monokai theme to the collection.
  • New Theme: Added a new nord theme to the collection.
  • New Theme: Added a new solarized-dark theme to the collection.
  • New Theme: Added a new solarized-light theme to the collection.
  • New Theme: Added a new tokyo-night-day theme to the collection.
  • New Theme: Added a new tokyo-night-storm theme to the collection.
  • New Theme: Added a new volcano theme to the collection.

Full Changelog: https://github.com/fsegurai/codemirror-themes/commits/v1.0.0

✅ Compatibility

  • ✅ Chrome
  • ✅ Firefox
  • ✅ Safari
  • ✅ Edge
  • ⚠️ Internet Explorer is not supported