Last Updated:

Best Visual Studio Code Extensions for Web Designers and Developers - Part 1

Chandan Chaurasia
Chandan Chaurasia Design

This article lists some of the best Visual Studio Code Extensions for Web Designers and Developers that are available free in the Visual Studio Marketplace with which you can add different functionalities to the editor. Apart from that, you can also fully customize Visual Studio Code and extend its functionality according to your needs.

1. VS Color Picker (Windows only)

 

vs code color picker

A tiny & smart color picker for web developer(Windows only).

Plugin linkhttps://marketplace.visualstudio.com/items?itemName=lihui.vs-color-picker

 

2. Live Sass Compiler

 

A VSCode Extension that help you to compile/transpile your SASS/SCSS files to CSS files at realtime with live browser reload.

Plugin linkhttps://marketplace.visualstudio.com/items?itemName=ritwickdey.live-sass

 

3. Font Awesome Codes for HTML

 

Snippets to create font-awesome codes in HTML.

Plugin linkhttps://marketplace.visualstudio.com/items?itemName=medzhidov.font-awesome-codes-html

 

4. CSS Peek

 

This plugin allows peeking to css ID and class strings as definitions from html files to respective CSS.

Plugin linkhttps://marketplace.visualstudio.com/items?itemName=pranaygp.vscode-css-peek

 

5. ES5/ES6 and CSS Minifier

 

This plugin helps to minify ES5/ES6/ES7/ES8 and CSS easily. Supports minify on save, minify selection & custom configurations.

Plugin linkhttps://marketplace.visualstudio.com/items?itemName=olback.es6-css-minify

 

6. JavaScript Booster

 

Boost your productivity with advanced JavaScript refactorings and commands

Plugin linkhttps://marketplace.visualstudio.com/items?itemName=sburg.vscode-javascript-booster

 

7. WooCommerce - Snippets & autocomplete

 

A collection of WooCommerce snippets and autocompletions.

Plugin linkhttps://marketplace.visualstudio.com/items?itemName=claudiosanches.woocommerce


Banner background photo credit: unsplash-logoFotis Fotopoulos

 

Comments