DEV Community

loading...
Cover image for Show off your VSCode Setup ๐Ÿ‘ฉ๐Ÿปโ€๐Ÿ’ป๐Ÿ’ฏ

Show off your VSCode Setup ๐Ÿ‘ฉ๐Ÿปโ€๐Ÿ’ป๐Ÿ’ฏ

sarthology profile image Sarthak Sharma ใƒป1 min read

After the last edition, which I loved a lot btw let's do it again this month too.

Screenshot 2021-03-24 at 2.56.15 PM

๐—ง๐—ต๐—ฒ๐—บ๐—ฒ: Deepdark Material Theme
๐—™๐—ผ๐—ป๐˜: Dank Mono
๐—ฃ๐—ฒ๐—ฎ๐—ธ๐—ฐ๐—ผ๐—ฎ๐—ธ ๐˜๐—ต๐—ฒ๐—บ๐—ฒ: #f22e60 colour code

So tell me what's your current VSCode theme and font look like? I'm Curious. Also, share your 3 personal favourite VSCode plugins.

Discussion (77)

pic
Editor guide
Collapse
anubra266 profile image
Collapse
fidohun profile image
FidoHUN

How did you set up this background? Can you provide a small tutorial?

Collapse
anubra266 profile image
Abraham Anuoluwapo

I'll put up a tutorial

Collapse
anubra266 profile image
Collapse
mazmis profile image
mazmis

right-sidebar team.

Collapse
michaelandreuzza profile image
michael-andreuzza

Hell yeah.

Collapse
sarthology profile image
Collapse
relativelyrehan profile image
Collapse
machineno15 profile image
Tanvir Shaikh

Is file broweser on right better than left ?

Collapse
relativelyrehan profile image
relativelyrehan

It's more of a personal preference I suppose. There's no better way๐Ÿ˜‡๐Ÿ˜…

Collapse
anubra266 profile image
Abraham Anuoluwapo

It actually is. Reason is toggling menu from left while working shifts your editor.
And that is distraction. But when it's toggled from right. You won't lose focus on where you where last.

Collapse
relativelyrehan profile image
relativelyrehan

Material Theme: Palenight - HC ๐Ÿง›๐Ÿง›

Collapse
standoge profile image
StanDoge

What's theme name?

Collapse
sarthology profile image
Sarthak Sharma Author

What's the theme name?

Collapse
jonrandy profile image
Collapse
whippingdot profile image
Sanjaay R.

My favorite theme of them all

xD

Collapse
sarthology profile image
Collapse
jonrandy profile image
Jon Randy

I don't use VS Code. It's slow and a resource hog

Thread Thread
haouthar profile image
harout_mardirossian

Most of the electron products are slow. Atom is based on electron too and it much much slower than any other editor. My personal favorite in simple text editors is Sublime Text - written in C++ and extremely fast

Thread Thread
jonrandy profile image
Jon Randy • Edited

Sublime Text is my editor of choice too

Collapse
ahmedsomaa profile image
Ahmed Somaa • Edited

my-setup

Theme: Gruvbox Dark Hard
Font Family: Input Mono, 12
Icons: material-icon-theme
Product Icons: fluent-icons

Collapse
soulninjadev profile image
Aadhithyan Suresh

thanks for this, I am going to use this from now, looks really nice

Collapse
ahmedsomaa profile image
Ahmed Somaa

You're welcome. That's great, let me know if you can make it even better.

Thread Thread
soulninjadev profile image
Aadhithyan Suresh

Nah, I'm not into customizing that much, I just use pre-made templates most often ๐Ÿ˜…

Thread Thread
soulninjadev profile image
Aadhithyan Suresh

I dont like designing that much lol, I suck at css and stuff like that

Collapse
sarthology profile image
Collapse
ahmedsomaa profile image
Ahmed Somaa

Always forget that comment uses markdown

Thread Thread
ahmedsomaa profile image
Ahmed Somaa

updated it

Collapse
obnoxiousnerd profile image
Pranav Karawale

Here's mine:
My Code Setup

  • Theme : Material Theme Ocean (its the base theme upon which I have put all my customizations)
  • Theme : Victor Mono
  • Icons : Material Icons (P.S And the project in the screenshot also uses Material Design, I โคMaterial)
Collapse
sarthology profile image
Sarthak Sharma Author

So clean โœจโœจ

Collapse
naseki profile image
Naseki

Naseki's VSCode setup

Theme: Remedy (dark - tilted)
Product icon theme: Carbon Icons
Font: JetBrains Mono

I don't really go crazy with plugins other than autocompletes, Live Server and a minifier. The one exception to that is Better Comments, a must-have to me.

Collapse
sarthology profile image
Sarthak Sharma Author

Sweet ๐Ÿ’ฏ๐Ÿš€

Collapse
whippingdot profile image
Sanjaay R.

Don't mind the code:
MOI SETUP

Theme: One Dark Pro
Font-Family: Fira Code
Icons: Material Icon Theme - Philipp Kief
Product Icon: Material Product Icons - Philipp Kief

Recommended MUST HAVE extensions:
Code Spell Checker
Error Lens
Project Manager

P.S. Philipp Kief is AWESOME with icons!

P.S.P.S. The blue marking on the scroll bar is blue because it is a spell check error and it is shown brightly because of the Error Lens extension.

Collapse
msamgan profile image
Collapse
natriumdev profile image
NatriumDev

+1 for a light theme. We are a rare breed.

Collapse
msamgan profile image
Mohammed Samgan Khan

no offence to people use dark, but dark theme are overrated.
ones u start using light there is no going back..

FORCE is way stronger on the light side...

Thread Thread
sarthology profile image
Sarthak Sharma Author

Relax folks ๐Ÿ˜…

Collapse
sarthology profile image
Sarthak Sharma Author

I love them too.

Collapse
dabibu153 profile image
saurav sharma

image

theme: deepdark material theme

fav plugins:

  1. Turbo console log
  2. TabNine auto complete
  3. Codalyze
Collapse
sarthology profile image
Sarthak Sharma Author

Same pinch dude.

Collapse
relisalazar profile image
Reli

Theme: Gruvbox Dark Medium
Font Family: Fira Code, 14
icons: material-icon-theme

I really like to hide and show parts of the UI with shortcuts, I think it's very clean.

Collapse
bobbypatterson profile image
Bobby Patterson

Nightcall

Theme: Nightcall (my own theme ๐Ÿคช)
Font Family: Dank Mono
Icons: material-icon-theme
Product Icons: fluent-icons
Fave Plugins: Footsteps, Indent-Rainbow, Tailwind CSS IntelliSense

Collapse
pranavbaburaj profile image
Pranav Baburaj • Edited

Theme : Night Owl
Icon : Vscode Icons Mac
Extensions : I have a lot of extensions

Collapse
sarthology profile image
Sarthak Sharma Author

Which theme is it?

Collapse
briang123 profile image
Brian Gaines

My VSCode theme

Here's mine:
Theme: Operator Mono Dark Theme
Font: Operator Mono', Consolas, 'Courier New', monospace

Collapse
sarthology profile image
Sarthak Sharma Author

So good ๐Ÿคฉ

Collapse
rish7223 profile image
Rishabh Tyagi

๐Ÿ˜ฒ๐Ÿ˜ฒ๐Ÿ‘

Theme: Monokai
Extensions: ES7, Live server

Collapse
sarthology profile image
Collapse
haouthar profile image
harout_mardirossian • Edited

My setup, but I donโ€™t use VSCode ๐Ÿ˜๐Ÿ˜๐Ÿ˜
IntelliJ IDEA + Material UI theme + Atom Material File Icons + Cascadia Code font

IntelliJ IDEA

Collapse
sarthology profile image
Collapse
xrishi20 profile image
Collapse
sarthology profile image
Sarthak Sharma Author

Woah ๐Ÿคฉ
And font?

Collapse
gitkat profile image
GitKat


I dont use VScode. I use outdated Brackets.io With Dark Theme

Collapse
gaurang847 profile image
Gaurang

Here's mine :)
screenshot of my VS Code setup

Theme: Mirage by tristanremy
Font: FiraCode Nerd Font
File Icon Theme: Helium Icon Theme by Helgard Richard Ferreira

Collapse
pzelnip profile image
Adam Parkin

Theme: Super One Dark (have made a couple minor tweaks to that theme)
Font: Menlo, Monaco, 'Courier New', monospace. 12 point.
Icons: vscode-icons (marketplace.visualstudio.com/items...)

Picking 3 favourite plugins is like trying to pick your 3 favourite children. I love all 62 I currently have installed. :)

My Setup

Collapse
wasiqahmdzai profile image
Mohammad Wasiq

Theme: Mayukai Mono
Font: JetBrains Mono
Favourite Extensions: TODO Highlight, WakaTime, Import Cost

Collapse
sarthology profile image
Collapse
wasiqahmdzai profile image
Thread Thread
sarthology profile image
Collapse
im6h profile image
Vu

My VSCode

But now I am using Vim.

Collapse
sarthology profile image
Collapse
im6h profile image
Vu

Base 16 Tomorrow

Collapse
kevinletchford profile image
Kevin Letchford • Edited

Custom Theme: Hyper Dimension
Font: Operator Mono

Desktop

Collapse
alangabrielbs profile image
Alan Gabriel

vscode
Theme: Omni
Font Family: Fira code (with font ligatures active) , 15
Icons: material-icon-theme

Collapse
nodirbekpy profile image
Nodirbek-py

Theme: synthwave 84, after installing enable neon effect by typing enable... on ctrl+shift+p
Icon theme: Material
Productivity: code time

Collapse
sarthology profile image
Sarthak Sharma Author

Synthwave is dope ๐Ÿ’ฏ

Collapse
m0ng0lfalcon profile image
F4lc0n

screen

Theme : One Dark Pro

Font Family : Input Mono

File Icon : Vscode Great Icon

Collapse
sarthology profile image
Collapse
bobbyiliev profile image
Collapse
sarthology profile image
Sarthak Sharma Author

๐Ÿ’ช๐Ÿผ

Collapse
wells4sure profile image
Wellington Chanda

๐—ง๐—ต๐—ฒ๐—บ๐—ฒ: BeardedTheme Black & Emerald
Product icon theme: Fluent Icons
Font: Consolas, 'Courier New', monospace

Collapse
sarthology profile image
Sarthak Sharma Author

Gotta try this font.

Collapse
dsmorais profile image
David Morais

Theme ๐Ÿ‘‰ Electron Vue Darker

Collapse
rashil2000 profile image
Rashil Gandhi

doom

*Rip and Tear plays in the background

Collapse
devmedtz profile image
DevMed • Edited

Great tutorial, I real appreciate,

Collapse
mrdulin profile image
official_dulin • Edited

Theme: Dark+(default dark)
Font: Operator Mono
Font Size: 13

Collapse
gokulkrishh profile image