Show off your VSCode Setup 👩🏻‍💻💯

If you are like me you also like changing your theme and font of VSCode frequently. I also love to find new themes and fonts. Here is mine.

𝗧𝗵𝗲𝗺𝗲: Cobalt2 Rocket
𝗙𝗼𝗻𝘁: Cascadia Code PL
𝗣𝗲𝗮𝗸𝗰𝗼𝗮𝗸 𝘁𝗵𝗲𝗺𝗲: Svelte Orange

Top 3 Plugins I ❤️

• Polacode : Carbon like Polaroid for your code
• ES7 React/Redux/GraphQL/React-Native snippets
• Todo+: Manage todo lists with ease. Powerful, easy to use and customizable.

So tell me what's your current VSCode theme and font look like? I'm Curious.

Comments

[Pavan Jadhaw]

hi res screenshot
Theme: Karma
Font: Dank Mono

[marlonry]

Game changer to have the side bar on the right :o

[Duc Nguyen]

What’s the benefit though? I’ve tried a few times but keep going back to having it on the left. It feels weird to have the code indent all the way to left of the screen.

[menaaziz27]

the benefit is noticed if you're using Ctrl+B very often .. the code would be indented every time if you have the side bar on the left.

[Michael R.]

And until Microsoft added the option to switch the control bar to the right, the code always looked like 💩 until you formatted it when you were ready to push to GitHub. I remember very well 🙄

[marlonry]

It all comes down to your preference. To me it just looks less cluttered on the left side.

[Sarthak Sharma]

Dank mono is such a good font. I still gotta try that right sidebar thing. What’s your settings.json?

[Nicholas @ 127.0.0.1 (::1)]

I'm now trying the sidebar on the right. Its making more sense to have it like this. Good one!

[samuelmugi]

i have always had mine on the right. Not going back soon

[Pavan Jadhaw]

here is the last snapshot of my settings

[Sarthak Sharma]

Thanks man 😊

[Uday Yadav]

Nice theme

[Anshul Saini]

Can you pls tell me what extension you're using for indentation like this?

[Pavan Jadhaw]

Its indent rainbow and bracket pair colorizer

[Amy-Kate Andrews]

Theme: 1984 - Light
Font: Dank Mono
Extensions: Alphabetical Sorter, Bracket Pair Colorizer, Git Blame, PHP Intelephense, Prettier, Snippet Creator, TODO Highlight

[ProMikeCoder2020]

You use light theme?

[Amy-Kate Andrews]

Yep! It feels better on my eyes.

[Sarthak Sharma]

Try horizon

[🌌 Sébastien Feugère ☔]

Dark themes are better for the night times or cloudy weather. Used in a very bright atmosphere (like in an office with neons) they don't make a lot of sense and could hurt your eyes.

I switch between light and dark themes many times a day. There are even extensions to toggle them automatically (not a VSCode thing: the Opera browser does this natively).

[Peter C]

Nice to see a good light theme, I find them much easier on the eye.

[Ejabu]

I think you may love this

gist.github.com/ejabu/6452f6e7c3ca...

[Michael R.]

I would need sunglasses to code in this IDE, but very beautiful job with the theme, it's certainly eye-catching!

Also I have a theory that there is a shared trait between devs who use light-themed IDEs must also be morning people. @heyamyk8 are you a morning person?

I like to code at night, so I love defined, sharp shadows, layered UIs, and of course, dark theme. 🙃🙃🙃

[Pavan Jadhaw]

This looks really sweet, I might give light theme a try. Thanks for sharing Amy

[Anshul Saini]

Can you pls suggest me some good light themes like this?

[DNI9]

hm..

[Atulit Anand]

Its pretty fresh. Thanks for suggestion.
You should definitely checkout the GitHub theme for vscode it's dope

[daniely-93]

Have you tried a dark theme? I can't imagine staring for a few hours this theme 😂

[Sarthak Sharma]

TODO Highlight is a cool one. 🙌🏼

[CoderZ90]

Hey wowo nice theme and also love your settings its pretty clean
can you please provide your settings.json of your vscode want to try your settings lol

[CoderZ90]

wow can you give your vscode settings file plz

[Rishabh Tyagi]

Cool 🔥
Here's mine
Theme: BeardedTheme Monokai Metallian
Extensions: Color Highlight, Bracket Pair Colorizer.

[Ridhik Govind]

This is looking amazing bruh ! ;)

[LelouchBrowneyes]

Thanks for the cap.

[Jitu Nayak]

Thanks for the color highlight extension. I never used it before. But i knew that i need this functionality 😜

[Abdullah Miraz]

best of all to me, thanks man 😎

[Rishabh Tyagi]

🤟🤟

[Sarthak Sharma]

Damn, gotta try this theme.

[saurav sharma]

this is how my current IDE setup look likes

[Sarthak Sharma]

Woah !! that's dope. What's the theme name?

[saurav sharma]

theme: Deepdark Material Theme

[Sarthak Sharma]

Nice !!

[Zul-fwz]

Extension?

[ipramudya]

what font is that ?

[Imagineee]

love the darknes

[t7yang]

Theme: Dark Lavender my theme
Font: Lilex

[Hardik Khichi]

I want to try Lilex. What did you input in "editor.fontFamily" in settngs.json. "Lilex" is not working for me. Same with the nerdfont varient.

[t7yang]

Here is the download page for Lilex, you need to install Lilex (either otf or ttf) then restart VSCode and add Lilex at the very beginning of editor.fontFamily:
"editor.fontFamily": "Lilex, ...other fonts",

[Alexandru019]

I can't get it to work, I have installed the font, I have put it in vs code and I have even restarted the computer and I do not get the same font, any ideas?

[t7yang]

show your vscode settings

[Alexandru019]

{
"editor.linkedEditing": true,
"tabnine.experimentalAutoImports": true,
"workbench.iconTheme": "material-icon-theme",
"workbench.productIconTheme": "fluent-icons",
"editor.renderWhitespace": "none",
"git.autofetch": true,
"git.confirmSync": false,
"window.zoomLevel": -1,
"php.validate.executablePath": "C:\php\php.exe",
"workbench.colorTheme": "Dracula",
"editor.fontLigatures": null,
"editor.fontFamily": "Lilex,Consolas, 'Courier New', monospace"

}

[Alexandru019]

I have solved it by myself.
editor.fontLigatures was in null , i changed to true .
Thank you anyway

[t7yang]

hmm... I'm not sure why. But some suggestions for you:

• check Lilex font has installed properly on you os.
• restart you os
• use a portable fresh vscode to check whether it work with Lilex or not. (download vscode zip version, extract and run with a empty data folder same level with code.exe, if you running on Windows)

[Sarthak Sharma]

Sweet

[Gulajava Ministudio]

My current VS Code Setup :
Theme : Mayukai Theme
Font : Iosevka Mayukai

Currently using VS Code Plugin :

• Vetur
• ES6 Snippets
• Docker
• Gitlens
• indent-rainbow
• Bracket Pair Colorizer 2

[Jolene Langlinais]

Theme: Lucy
Font: Fira Code

[Reaper]

---

Plugins : Go , TSlint, Prettier, advanced-new-file
Theme: Horizon Italic
Font: Comic Mono

[thisisleobro]

This is so beautyfull. The theme, the font, go, panel to the right... God

[Reaper]

Haha thanks 😊

[strawhatsai]

damn son. this is amazing

[Junxiao Shi]

I didn't bother to look for the buttons for changing fonts and colors. The default looks fine.

Plugins:

• trailing spaces to delete unnecessary whitespaces
• code spell checker
• Go, Python, C++, …
• markdownlint, Better TOML, …
• PlatformIO (disabled by default, enable in IoT workspace only)

[Pacharapol Withayasakpunt]

Used to use Markdownlint too.

It is nice, but it is one of a few plugins, that shouldn't be ON be default; otherwise, you can't cooperate with others...

[Junxiao Shi]

I have Markdownlint configuration in the repository, and CI fails the build if there's any violation. I don't see a problem here.

[Pacharapol Withayasakpunt]

I made PR to people who don't have Markdownlint, too.

[Zachary Stone]

Theme: Arbitor
Font: Jetbrains Mono w/ font ligatures

[Sarthak Sharma]

How does it looks?

[Zachary Stone]

Do you not see my picture in the post?

[Sarthak Sharma]

Shit, it wasn't showing in the Notification section my bad. 😅

[Zachary Stone]

No worries! I was having issues myself and had to refresh my page.

[Sarthak Sharma]

But anyways, your setup looks cool. 🔥

[Zachary Stone]

Thanks! I really enjoy Jet Brains Mono and their support of ligatures. I was rocking a very SynthWave 80s retro theme for a while, but it was hard on the eyes haha.

[Sarthak Sharma]

SynthWave 🥲 I always tried to use it but seems to complex to even setup.