Tokyo Themes for Emacs

A faithful Emacs port of folke's Tokyo Night color theme.

All four variants are included:

Installation

MELPA

Tokyo Night is available on MELPA. Assuming you've configured MELPA as a package source:

M-x package-install RET tokyo-night RET

Then load any variant:

(load-theme 'tokyo-night t)

Or with use-package:

(use-package tokyo-night
  :ensure t
  :config
  (load-theme 'tokyo-night t))

package-vc (Emacs 29+)

(package-vc-install "https://github.com/bbatsov/tokyo-night-emacs")
(load-theme 'tokyo-night t)

use-package (Emacs 30+)

(use-package tokyo-night
  :vc (:url "https://github.com/bbatsov/tokyo-night-emacs" :rev :newest)
  :config
  (load-theme 'tokyo-night t))

Manual

Drop all .el files somewhere on your load-path and custom-theme-load-path, then:

(load-theme 'tokyo-night t)

Replace tokyo-night with tokyo-night-storm, tokyo-night-moon, or tokyo-night-day to use a different variant.

Usage

Switch between variants interactively with M-x tokyo-night-select.

After changing customization variables, apply them without restarting with M-x tokyo-night-reload.

Browse the full color palette with M-x tokyo-night-list-colors (use C-u prefix to pick a specific variant).

Customization

You can override individual colors without forking:

(setq tokyo-night-override-colors-alist
      '(("tokyo-comment" . "#636da6")))  ; brighter comments
(load-theme 'tokyo-night t)

Overrides apply to all variants. See the tokyo-*-colors-alist variables in tokyo-night.el for all available color names.

Appearance options

A handful of booleans and numbers let you adjust the look without forking. They all take effect on the next load-theme.

Headings in org, outline, markdown, adoc, asciidoc, shr and info are scaled by default. Turn that off for uniform sizes:

(setq tokyo-night-scale-headings nil)

Or keep the scaling but tune how much each level grows:

(setq tokyo-night-height-doc-title 1.5   ; document titles (default 1.4)
      tokyo-night-height-1 1.4           ; level-1 headings (default 1.3)
      tokyo-night-height-2 1.2           ; level-2 headings (default 1.2)
      tokyo-night-height-3 1.1)          ; level-3 headings (default 1.1)

Render headings in a proportional font, which reads nicely for prose:

(setq tokyo-night-use-variable-pitch t)

Comments and keywords are italic by default. If your font renders italics poorly, turn either off:

(setq tokyo-night-italic-comments nil
      tokyo-night-italic-keywords nil)

Drop the box around the mode line for a flat look:

(setq tokyo-night-flat-mode-line t)

For a more visible current line highlight, use tokyo-bg-highlight instead of the default subtle tokyo-bg-line:

(setq tokyo-night-override-colors-alist
      '(("tokyo-bg-line" . "#292e42")))  ; same as tokyo-bg-highlight
(load-theme 'tokyo-night t)

Per-mode face overrides

If you want to tweak faces only in specific major modes (without affecting all buffers), use face-remap-add-relative in a mode hook:

;; Softer comments in org-mode
(add-hook 'org-mode-hook
          (lambda ()
            (face-remap-add-relative 'font-lock-comment-face
                                     :foreground "#636da6")))
;; Bolder strings in python-mode
(add-hook 'python-mode-hook
          (lambda ()
            (face-remap-add-relative 'font-lock-string-face
                                     :weight 'bold)))
;; Larger default font in eww
(add-hook 'eww-mode-hook
          (lambda ()
            (face-remap-add-relative 'default :height 1.15)))

These overrides are buffer-local and won't affect other modes. See Buffer-Local Face Remapping with face-remap-add-relative for more details.

Using theme colors in your config

The tokyo-night-with-colors macro binds all palette colors as local variables, so you can reference them without hardcoding hex values:

(tokyo-night-with-colors
  (set-face-attribute 'some-face nil :foreground tokyo-blue)
  (setq pdf-view-midnight-colors (cons tokyo-fg tokyo-bg)))

You can also look up a single color programmatically:

(tokyo-night-get-color "tokyo-blue")  ; => "#7aa2f7"

After-load hook

Run custom code every time a Tokyo theme is loaded:

(add-hook 'tokyo-night-after-load-hook
          (lambda (_theme)
            (set-face-attribute 'line-number nil :slant 'italic)))

The hook function receives the theme name as its argument.

Automatic light/dark switching

Tokyo Night pairs well with packages that switch themes based on the time of day or your OS appearance setting:

• auto-dark tracks your OS dark/light mode and switches themes to match:

(use-package auto-dark
  :config
  (setq auto-dark-dark-theme 'tokyo-night
        auto-dark-light-theme 'tokyo-night-day)
  (auto-dark-mode 1))

• circadian switches on a time-based schedule (e.g. sunrise/sunset):

(use-package circadian
  :config
  (setq circadian-themes '((:sunrise . tokyo-night-day)
                            (:sunset  . tokyo-night)))
  (circadian-setup))

See Automatic Light/Dark Theme Switching for a deeper look at both approaches.

Supported Packages

Beyond all built-in Emacs faces, the theme covers these packages:

• Completion: vertico, corfu, marginalia, orderless, consult, embark, company, ivy, swiper, copilot
• Development: magit, forge, transient, git-commit, git-rebase, git-timemachine, eglot, lsp-mode, lsp-ui, flycheck, cider, inf-ruby, gptel
• Editing: evil, smartparens, rainbow-delimiters, avy, ace-window, hydra, which-key, anzu, easy-kill, jinx, vundo, volatile-highlights
• Email: mu4e, notmuch
• Languages: clojure-mode, haskell-mode, erlang
• Markup: markdown-mode, adoc-mode, asciidoc-mode, web-mode
• UI: doom-modeline, treemacs, helpful, elfeed, keycast, mistty, breadcrumb

Missing a package? Open an issue or submit a PR.

Design

See DESIGN.md for the guiding principles behind color choices and face definitions.

Credits

The color palette is based on work by enkia and folke.

License

GPL v3+