Nox 2077 — VS Code Theme
Where cyberpunk neon meets personal taste
Nox 2077 is a handcrafted VS Code theme built on the shoulders of two excellent projects: the atmospheric cyberpunk glow of Synthwave '2077 by CodeSacha, and the foundational retro-futurist palette of Synthwave '84 by robbOwen.
The base was already close to perfect. What Nox 2077 adds is a personal visual language built around the Rosé Pine Moon background palette — deep purple-slate tones at #232136 instead of near-black — combined with a Tokyo Night-inspired syntax color system: warm golds for types, cyan-blues for operators, soft rose for variables, bright teal for strings. The neon glow effects from the original CSS are preserved intact.
Nox is Latin for night — the kind of deep, electric night that exists only in cyberpunk cities, where darkness is not empty but saturated with neon. 2077 carries the lineage forward from Synthwave '2077, the theme this is built on. Together: a night that belongs to the year 2077, rendered in code.
What changed from Synthwave '2077
- Background shifted from near-black
#101116 to Rosé Pine Moon #232136 — warmer, less harsh in long sessions
- Syntax palette replaced with a Tokyo Night-derived system: distinct color assignments per token category instead of the original monochromatic green
- Bracket highlights use six distinct neon colors for easy nesting depth reading
- Active line highlight is deep teal
#034439 — visible but not distracting
- Status bar, activity bar, sidebar, tabs all harmonized to the new background
- Purple accent
#ba1aef replaces the original teal for active tab borders and line numbers
- Neon glow CSS from the original is kept unchanged — same mtk class effects, same active tab gradient
Key Features
- Deep purple-slate backgrounds easy on the eyes in dark environments
- Carefully assigned syntax colors — each token category has its own hue, not a shared palette
- Six-color bracket pair highlighting
- Full neon glow on syntax tokens via Custom CSS and JS Loader
- Compatible with JavaScript, TypeScript, HTML, CSS, Python, and most major languages
Take a look
Installation
- Open the Marketplace in Visual Studio Code and search for "Nox 2077."
- Click the Install button to add the theme to your VS Code.
- Once the installation is complete, click Reload to refresh your editor.
- To activate the theme, go to File → Preferences → Color Theme and select Nox 2077.
- To enable the neon glow effects, install Custom CSS and JS Loader and point it to the included
custom-style.css file using the Enable Custom CSS and JS command in the command palette Ctrl+Shift+P or Cmd+Shift+P on Mac.
- To disable the glow, use the Disable Custom CSS and JS command in the command palette.
- Each time you enable or disable the custom styles, VS Code will reload to apply the changes.
- To customize your terminal theme, install oh my zsh! and choose your desired theme!
Inspiration
Background tones inspired by the Rosé Pine Moon palette by mvllow — specifically the warm purple-slate base that makes long coding sessions easier on the eyes than pure black.
Disclaimer
I am not a professional theme developer — I simply fell in love with the cyberpunk neon aesthetic of Synthwave '2077 and wanted to reshape it around my own color sensibility.
Credits ✨
License
This theme is a derivative work. The original Synthwave '2077 is distributed under the MIT License — see LICENSE.txt. This derivative is released under the same terms.
Enjoy!
If you enjoy the theme, please give it a ⭐️ on GitHub — it means a lot and helps others find it!
