This content originally appeared on DEV Community and was authored by Agustín Rodríguez
A good theme isn’t just a color palette — it’s a tool to protect your focus, reduce fatigue, and make your editor feel like home.
Why build a theme?
I’ve always enjoyed fine-tuning my development environment — from terminal fonts to keyboard shortcuts. But I could never quite settle on a theme that felt truly coherent, balanced, and comfortable for long hours of work.
So I decided to try something: build my own Visual Studio Code theme.
Not as a designer, but as a developer — out of curiosity, to learn, and to see how much impact a well-crafted theme could really have.
Dark, soft, and focused — that’s Harmonia
From the start, Harmonia had a clear goal: to be a dark, soft, visually consistent theme, especially tailored for web developers.
I focused on the languages and file types I use the most: PHP, JavaScript (and friends like TypeScript and JSX), JSON, config files, Docker, Apache, Nginx, and log files.
The idea was to highlight what matters without visual noise. A theme that feels calm and lets your code breathe.
The color decisions
Instead of choosing flashy or high-contrast colors, I took a more subtle approach:
• Soft yet deep background: dark enough to reduce eye strain, but not harsh black.
• Readable, rich foreground: avoiding pure white or washed-out grays.
• Syntax colors with character — not chaos: strong enough to be useful, but not overwhelming.
Each color was tested and adjusted to feel consistent across different languages and syntaxes, without breaking the harmony of the overall palette.
Why colors matter
We spend countless hours looking at our editors. A bad theme can be a constant source of visual fatigue, even if you don’t realize it.
A well-balanced color scheme can help you:
• stay focused longer
• avoid headaches or eye strain
• actually enjoy the experience of coding a bit more
In my opinion, a theme is part of developer ergonomics. Just like a good chair or a calibrated monitor. You don’t notice the value — until you use one that’s actually well made.
What I learned along the way
Creating a theme is more technical than it might seem. I learned:
• how VS Code token scopes work
• how to group styles across languages and file types
• how to test palettes while keeping consistency
• how to package and publish to the VS Code Marketplace
• how to generate proper previews for other users to see what you see
It wasn’t hard — but it was detail-heavy.
And that made it fun.
About updates
I work full-time, so updates may not come frequently — but I’ll continue improving Harmonia little by little, especially around the languages and tools I use most in web development.
That includes PHP, JS/TS, JSON, configs, Dockerfiles, and log files.
If time allows, I’d love to expand support for other languages and improve the theme’s scope coverage even more.
Where to find it
Harmonia Theme is available now on the Visual Studio Code Marketplace.
Direct link to the extension
Screenshots and changelog on GitHub
Thanks for reading
This was a small side project — but one that brought me a lot of satisfaction.
If it helps even one more developer feel a bit more comfortable during a long coding session, it was totally worth it.
And if you try it — I’d love to hear what you think.
Cover image credit: Pankaj Patel, via Unsplash
This content originally appeared on DEV Community and was authored by Agustín Rodríguez