Tokyo Night vs Catppuccin: Which Theme Fits Your Setup?

Shop the Catppuccin Keycap Set

If you have ever set up a new editor, terminal, or laptop and gone looking for a dark theme, you have almost certainly been offered the same two names: Tokyo Night and Catppuccin. They show up in preset lists, dotfile repos, and screenshot threads for the same reason. Neither is a skin for one app. Both are portable palettes that people try to run across an entire setup.

They are also easy to confuse at a glance. Both are dark, blue-leaning, and popular with people who care how a terminal looks in a screenshot. The difference is not “one is blue and one is pink.” It is a different idea of what a theme is for.

Tokyo Night is a look: downtown Tokyo after dark, neon against indigo. Catppuccin is a system: a named pastel palette with four roast levels and official ports for almost everything you might open in a day. This piece compares them on origin, variants, color language, how they feel after a few hours of reading code, and how far each one actually travels outside the editor.

Where they come from

Tokyo Night started as a Visual Studio Code theme by enkia. The brief is specific: a clean dark theme that celebrates the lights of downtown Tokyo at night. Deep indigo sky, electric signage, a little warm amber. The result is often described as neon-noir — cinematic, cool, and slightly dramatic. That origin still shows. The palette is a composed scene, not a design-token set.

Catppuccin is a community project with a different pitch: a soothing pastel theme for the high-spirited. It is less “one city at one hour” and more “one color system, many surfaces.” The maintainers treat the palette like a small design language. Colors have names (Mauve, Peach, Sapphire, Latte) and official mappings across editors, terminals, browsers, and chat apps. If Tokyo Night feels like a photograph, Catppuccin feels like a brand kit.

Tokyo Night sells a mood. Catppuccin sells consistency.

The variants are not the same kind of choice

Both families give you a few presets. They are not interchangeable kinds of presets.

Tokyo Night is one night scene with the lights turned up or down:

• Night — the darkest, background #1a1b26. This is usually what people mean by “Tokyo Night.”
• Storm — a step lighter and a bit bluer (#24283b). Common default in Neovim ports.
• Moon — a later, slightly softer cut of the same idea.
• Day — a light inversion. It exists, and fewer people live in it.

Catppuccin is one 26-color card baked four ways:

• Latte — the light theme, and a first-class one.
• Frappé — muted medium-dark.
• Macchiato — darker, still short of the bottom.
• Mocha — the darkest, base #1e1e2e. The default most screenshots use.

That distinction matters when you switch environments. In Tokyo Night, Night and Storm change how deep the room feels; the accents stay in the same family. In Catppuccin, Latte through Mocha keep the same named roles — blue is still Blue, mauve is still Mauve — and only the roast changes. If you want a real light theme that still “is” the same theme, Catppuccin Latte is the more honest option. Tokyo Night Day is a counterpart, not the product most of the ecosystem is built around.

Color language: cold neon vs warm pastel

Put the two dark defaults side by side and the backgrounds are closer than the marketing suggests. Tokyo Night Night sits at #1a1b26. Catppuccin Mocha sits at #1e1e2e. Both avoid pure black. The split is in temperature and how the accents behave.

Tokyo Night’s editor chrome is indigo-navy. Foreground text is a lavender-white (#c0caf5 / #a9b1d6), not paper white. The accents you notice first are electric blue #7aa2f7 and magenta #bb9af7, with cyan, a yellow-green, and a streetlight orange in supporting roles. Comments drop to a muted blue-gray (#565f89). The hierarchy is deliberate: important tokens stay bright, secondary text recedes. That is why the theme photographs well, and why comments can disappear on a dim panel.

Catppuccin Mocha is purple-gray rather than navy. The text (#cdd6f4) is a little closer to the accents in weight, so the page feels flatter and softer. Accents are spread across a pastel set instead of leaning on two neon leads: Mauve #cba6f7, Blue #89b4fa, Peach #fab387, Teal #94e2d5, Green #a6e3a1. Nothing is trying to look like a sign over Shinjuku. The whole surface is supposed to stay friendly at 1 a.m.

Hex values are a poor substitute for a screenshot, but they make the thesis concrete: Tokyo Night concentrates energy in a few saturated leads against a deeper navy. Catppuccin distributes softer color more evenly, so fewer things pop and fewer things vanish.

How they feel after a few hours of code

Syntax highlighting is where the philosophies become practical.

Tokyo Night tends to assign color by role with a visible stack. Flow control and keywords can sit in purple, functions in that electric blue, strings in green, types a step off from functions. Italics show up on comments and some keywords in the better ports. The file looks designed. On a bright monitor it also looks expensive, which is why it dominates “rate my rice” posts. The cost is the dim end of the palette. If you keep brightness low, or you work on a washed-out laptop panel, comments and line numbers fall into the background faster than you want.

Catppuccin is less theatrical. Tokens are distinct enough to scan, but the contrast between a keyword and a string is gentler. That is the point of the pastel brief: avoid the harshness of high-contrast themes without sliding into the gray mush of under-saturated ones. For long sessions, especially in a lit room, Mocha or Macchiato is easier to leave on. You will not get the same “this buffer is a poster” effect.

Light mode is the other daily-use gap. Catppuccin Latte is a real light theme with the same named roles, so your muscle memory for “mauve means this kind of token” survives the switch. Tokyo Night Day keeps family resemblance, but the ecosystem, screenshots, and most configs assume a dark style. If you actually write in daylight, Latte is the less awkward commute.

Neither palette is a readability problem in mainstream languages. The question is whether you want hierarchy you can see from across the room, or a surface you can stare at until dinner.

Ecosystem: who covers the rest of the machine

This is the comparison that is not about taste.

Catppuccin’s main advantage is the port library. The same named colors show up in official or semi-official ports for editors, terminals, browsers, Discord, system components, and a long tail of tools people forget they themed. Because the palette is a card with stable names, a new port does not have to invent a mapping from scratch. If your goal is “the terminal, the editor, the browser chrome, and the chat app should look like one product,” Catppuccin is the one that was built for that job.

Tokyo Night is very strong in the places developers live first: VS Code, terminals, and Neovim — folke/tokyonight.nvim in particular is a default for a large part of the Lua Neovim world. You can get a coherent editor-plus-terminal setup in an afternoon. Past that, coverage is patchier. You will find ports. You will also find apps where someone approximated the blues and the rest of the UI drifted. That is fine if you only care about the tools you type in. It is annoying if you are trying to theme a whole desktop.

A useful rule: if you already think in terms of a ricing screenshot of the entire session, Catppuccin is the less leaky bucket. If you only open VS Code or Neovim and a terminal, the ecosystem gap shrinks to almost nothing, and the visual choice takes over again.

Configuration: a look versus a kit

Tokyo Night configurations tend to be short. Pick a style, maybe turn on a transparent background, stop. The theme is opinionated on purpose. There is not much to tune because the look is the product.

Catppuccin configurations run longer because the project treats integrations as part of the theme. Flavor, italic and bold toggles, per-plugin integrations, and custom highlight overrides are normal. That is helpful when you want Treesitter, a file picker, and a statusline to share one set of decisions. It is extra YAML when you just wanted the colors to change.

If you like opening a config file once and forgetting it, Tokyo Night is the smaller object. If you like one palette that you can keep adjusting as you add tools, Catppuccin is built for that habit.

How to choose

Both themes cleared the “is this actually good” bar years ago. Picking one is less about quality and more about which problem you are solving.

There is a boring version of this advice that is still the right one. If half your apps are already on one of these palettes, finish the set instead of starting a migration for a 4% shift in hue. The interesting difference only appears when you are choosing from zero, or when you are specifically unhappy with neon-vs-pastel or with how far the ports go.

A closing distinction, not a winner

Tokyo Night is a night photograph with a few bright signs. It is cooler, more hierarchical, and at its best in the editor and the terminal, especially when you want the screen to look like a product shot. Catppuccin is a named pastel system. It is warmer, more even, and at its best when the same card has to survive contact with twenty applications.

You can be happy in either. You will be happier if you pick the one whose job matches what you are actually trying to theme — a couple of windows you stare at, or the whole machine around them.

Sources worth keeping: the Tokyo Night VS Code theme, tokyonight.nvim, and the Catppuccin org with its port list and palette documentation.