My Visual Studio Code Setup
Tags: webdev, vscode, extensions
Published: 2020-03-20 22:30:25

---
title: My Visual Studio Code Setup
published: true
date: 2020-03-20 21:56:26 UTC
tags: #webdev, #vscode, #extensions
canonical_url: 
---

I use Visual Studio Code as my editor for coding and writing, here are the extensions that make it mine.

### For Web Development

*   [Auto Close Tag](https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-close-tag) Automatically add HTML/XML close tag, same as Visual Studio IDE or Sublime Text does
*   [Code Spell Checker](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker) A basic spell checker that helps catch common spelling errors while keeping the number of false positives low.
*   [Color Highlight](https://marketplace.visualstudio.com/items?itemName=naumovs.color-highlight) This extension styles css/web colors found in your document.
*   [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer) Launch a development local Server with live reload feature for static & dynamic pages
*   [Live Share](https://marketplace.visualstudio.com/items?itemName=MS-vsliveshare.vsliveshare) Real-time collaborative development from the comfort of your favorite tools
*   [ Live Share Audio](https://marketplace.visualstudio.com/items?itemName=MS-vsliveshare.vsliveshare-audio) Adds audio calling capabilities to Visual Studio Live Share
*   [Live Share Chat](https://marketplace.visualstudio.com/items?itemName=karigari.chat) Chat with your team while you collaborate over code using VS Live Share
*   [ Live Share Extension Pack](https://marketplace.visualstudio.com/items?itemName=MS-vsliveshare.vsliveshare-pack) Collection of extensions that enable real-time collaborative development with VS Live Share.
*   [Open in Browser](https://marketplace.visualstudio.com/items?itemName=techer.open-in-browser) This allows you to open the current file in your default browser or application.
*   [Prettier - Code formatter](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode)Formats JavaScript, TypeScript, CSS, HTML, Markdown, YAML and more.

*   [Rainbow Brackets](https://marketplace.visualstudio.com/items?itemName=2gua.rainbow-brackets) Provide rainbow colors for the round brackets, the square brackets and the squiggly brackets.

### Markdown and Document Management

*   [Copy Markdown as HTML](https://marketplace.visualstudio.com/items?itemName=jerriepelser.copy-markdown-as-html) Copies the selected text from a markdown document to the clipboard as HTML.
*   [Markdown All in One](https://marketplace.visualstudio.com/items?itemName=yzhang.markdown-all-in-one) All you need to write Markdown (keyboard shortcuts, table of contents, auto preview and more)

*   [Markdown Helper](https://marketplace.visualstudio.com/items?itemName=joshbax.mdhelper) Apply Markdown formatting to text (keyboard shortcuts, context menu)
*   [Markdown PDF](https://marketplace.visualstudio.com/items?itemName=yzane.markdown-pdf) Convert Markdown to PDF   
*   [ Markdown Lint](https://marketplace.visualstudio.com/items?itemName=DavidAnson.vscode-markdownlint)Markdown linting and style checking for Visual Studio Code
*   [Settings Sync](https://marketplace.visualstudio.com/items?itemName=Shan.code-settings-sync) Synchronize Settings, Snippets, Themes, File Icons, and Extensions Across Multiple Machines using GitHub Gist.
*   [Spell Right](https://marketplace.visualstudio.com/items?itemName=ban.spellright) Multilingual, Offline and Lightweight Spellchecker

### Colors/Theme

*   [VSCode icons](https://marketplace.visualstudio.com/items?itemName=vscode-icons-team.vscode-icons) Icons for Visual Studio Code

*   [ Dracula at Night Theme ](https://marketplace.visualstudio.com/items?itemName=bceskavich.theme-dracula-at-night) A fork of the Dracula Official, but darker 
![Dracula at Night Screen capture](https://dev-to-uploads.s3.amazonaws.com/i/judxl7yst4e379k0u0q5.png)