PS: I understand that depending on your background color or color theme on DEV.to, you might not notice a big difference - and all images might pretty much look alike -, so the best way is to actually test it on VSCode itself. So give it a try and see if this is for you or not.
This one feat is long overdue, when I first launched Nebula Oni Color Theme. I remember showing it to my sister because her boyfriend is a developer - and has dev friends as well. It was my first project and I wanted some feedback.
Although they did like it, complimented the extensive documentation and the work I put on it, my sister's boyfriend said it was too bright for him, that he was used to less contrasty and darker overall colors. Something that I didn't think about when I was making it because when I looked for themes, they were, in general, simply normal dark themes and some high-contrast themes.
If you haven't read yet, you can check other articles from this color theme series here.
I should have created this option back then when the code was still fresh in my mind but after months working on this, I was tired and just wanted to be done with it. So months had passed and when I thought about finding a way to implement it, I wasn't so familiar with Javascript anymore - I was studying C - and much less with the VSCode API. It looked like too much work.
Now more than two years have passed and here we are, I'm back at studying programming after a forced hiatus and I decided it was time to implement the Dimmed Syntax Colors - but also as an exercise.
VSCode Menu Settings
As any other menu option for Nebula Oni Theme, you type "nebula oni" on VSCode settings and there will be an option for the Dimmed Syntax Color.
To be honest, this is not something I will be using but it's another option to have and maybe some of you do prefer it, even more when working at night, I don't know.
The colors are about 10~15% darker - and I say like that because simply making it equally darker doesn't work well for colors. You can also use darker background colors with it so you get a bit of the contrast back but the overall colors will be darker.
Normal vs Dimmed
In this first example you have the same Grey Background, the one on top has the Normal Syntax Brightness while the other is Dimmed.
Different Background
In this next example the second one isn't just using the Dimmed option but also with a Dark Grey Background. This increases the contrast to similar levels to the Normal Syntax Brightness with Grey Background, but the overall theme is darker.
Four Different Contrast Levels
Finally, we have all the contrast level options.
Darker Background with Normal Syntax Brightness for high-contrast settings.
Normal Background and Normal Syntax Brightness or Darker Background with Dimmed Syntax Brightness for a middle of the pack contrast level.
And for low-contrast, just combine Dimmed Syntax Brightness with Normal Background Color.
Help Support Nebula Oni Color Theme
If you want to support this theme, would you consider:
- sharing this theme with friends and colleagues
- rating it on Visual Studio Code Market Place and Open VSX Market Place
- giving it a star on Github
And if you really liked this theme, would you consider buying me a coffee?
Thanks,
[ psudo.dev ]
Top comments (0)