5 Underrated VSCode Extensions to Start Using Today

I bet there’s at least one here you haven’t seen yet…

Richard So
codeburst

--

Intro

Visual Studio Code (VSCode) has become one of the most popular code editors for a few years already. In fact, it’s been considered by many (including me) as an IDE, thanks to the huge catalog of extensions that VSCode has to offer.

There’s no doubt that VSCode wouldn’t be as attractive of a choice if there weren’t as many extensions to choose from, let alone if there weren’t any extensions at all. So, without further ado, here are some really underrated but cool extensions that you should definitely try out and use today!

As always, there are different types of developers that use different programming languages (calling out all the JS Web Devs reading this). I’ll try my best to suggest extensions that would be useful for all VSCode users.

Table of Extensions

  1. Codesnap
  2. Marquee
  3. TabNine
  4. filesize
  5. :emojisense:

1. Codesnap

Have you ever wondered how you could generate high-resolution, beautiful pictures of your code? Are you jealous of pictures like this one below that keeps showing up around the internet? If you said “yes” to any of these, try Codesnap!

Generated using the Codesnap extension😮😮😮

With Codesnap, you can easily generate images such as these directly in VSCode (no need for Carbon anymore)!

Using the extension is extremely simple. First, you activate Codesnap using the command palette. Second, you copy the code you want to be put as part of your output image. Third and finally, save the image! The GIF below will show in full detail the short process.

Codesnap’s color theme matches your VSCode theme by default, but you can customize that anytime in the settings menu.

Using codesnap in VSCode. Theme: Andromeda

2. Marquee

If you’ve ever used Google Chrome before, you’ve probably heard of extensions that revamp your home screen to either be more useful or beautiful.

Google Chrome’s Momentum extension. Image courtesy of Momentum.

Marquee is a well-executed “home screen” for your VSCode set up, packaged as an extension. Take a look below!

Marquee “home screen”

With this extension, you are able to surf recent news stories, trending GitHub repositories, and even the weather, in just one screen! If you don’t feel like alt-tabbing out of your code environment to check TheWeatherChannel or your news feed, Marquee is perfect for you.

Additionally, Marquee supports the user to add items to a personal todo list, as well as a scratchpad for some quick notes. Some small but useful features for a programmer, if I do say so myself.

3. TabNine

GIF courtesy of TabNine for VSCode

TabNine is an autocomplete helper that supports virtually any programming language out there. How? It uses AI and indexes through your files to form the most reasonable autocompletes for your code. The machine learning model that TabNine uses is stored locally in your filesystem (cool!). Most autocompletes from TabNine for VSCode will appear with a percentage confidence that the completed snippet is what you’re looking for.

Imagine having this good of an autocomplete for VSCode😍. Theme: Andromeda

The best part is that TabNine worked almost perfectly the first day I started using it (I presume TabNine imported a pre-trained ML model) and that the VSCode extension requires very little to no setup. As TabNine continues to learn from your programming style and common imports, it’ll only get more accurate from your first day with it.

4. filesize

This is probably the simplest extension on this list, if not tied with the next extension. filesize just tells you how big the file is that you’re currently on in VSCode. That’s all; sweet and amazingly simple.

My file is 1.24 KiB, according to the extension, which lives on the bottom status bar.

I can’t tell you how many times I open up file explorer to see how big a file is, but the filesize extension solves this small issue of mine.

But guess what, there’s more! Well, it’s not much, but clicking on the file size brings you to a bigger summary of your file, including the size, compressed size, as well as date created and changed. Pretty neat!

This happens once you click the filesize extension

5. :emojisense:

This GIF explains everything.

You know how you can insert emojis 😜 in Medium with shorthand colon (:insert_emoji_here:) notation? :emojisense: imports this feature onto VSCode whenever you are editing a Markdown file. Now you can add some style to your README files with some extra emojis!

Conclusion

Be sure to check some of these hugely underrated extensions out for yourself and supercharge your VSCode setup! This article is a spiritual successor to my other article below and here; be sure to read that as well! Thanks for reading, I hope this is helpful!

--

--

https://sorichard.com | BS/MS CS @ Georgia Tech, Class of ’25. Pursuing everything code. Always learning!