Hello there fellow humans!
I'm coming back to coding HTML, CSS and JS after 3 or 4 years to make a website for a friend of mine, and saw VS-Code now has A TON of cool addons that can really improve the coding experience!
What are your totally Must-Have addons that you got so used to having, that now you cant live without?
Visual studio code CSS indentation and formatting - Stack Overflow
How can I add custom CSS styles to VS Code? - Stack Overflow
Must-have Addons for VS-Code for HTML, CSS and JS?
Your favourite extensions for front-end development? (HTML/CSS/JS)
Auto Rename Tag is the extension I cannot live without.
I think this functionality is moved to the vscode itself in the recent release, though.
More on reddit.comWhat are the best VS Code extensions for web developers?
Which VS Code extension helps with code formatting?
Can I manage multiple VS Code extensions easily?
Videos
Yes, try installing vscode-css-formatter extension.
It just adds the functionality to format .css files and the shortcut stays the same Alt+Shift+F.
Beautify css/sass/scss/less
to run this
enter alt+shift+f
or
press F1 or ctrl+shift+p
and then enter beautify ..

an another one - JS-CSS-HTML Formatter
i think both this extension uses js-beautify internally
You currently can't do this without "performing surgery on VS Code" so to speak. VS Code colour themes don't allow arbitrary / custom CSS.
Workarounds
You can take a look at extensions like be5invis/vscode-custom-css, subframe7536.custom-ui-style, or drcika.apc-extension (I have no affiliation with these extensions). The first one basically provides a configuration point for you to specify paths to CSS files you want to be imported into VS Code's own CSS files, and modifies your VS Code installation's files to import those files, which will cause VS Code to issue a corruption warning, since it performs startup checks to see if its installation has been tampered with (probably for security reasons to protect you, and which you can mark to not be shown again through the gear button menu).
Why VS Code chooses not to add such a feature
I googled "site:github.com/microsoft/vscode/issues custom css" and found Simple CSS Editor Customization
#106750, which points toward Add some API to support GUI customization #1833, where exploring the linked tickets leads to Support user stylesheet(s) and user script(s) #459, which has a comment pointing to a rationale for why the VS Code team decided not to accept a Pull Request which implemented such a feature:
Thanks for this PR but we decided to not allow these kinds of modifications to our CSS directly. Rather, we think that our theming story should be evolved to allow more user configurations. See #26128, #26129 and #26130 for example.
The two main issues with this approach here is:
- basically this makes all of our CSS class names API (in the same way all of our themable colors have become API). we do not want to commit ourselves to keeping the CSS class names stable. rather we should find those styles that we want to make themable and then explicitly announce them as API (same as we did and do for colors)
- the other issue is that bug reports we receive will be harder to understand if users run with custom CSS changes that we are not aware of. we think that we should be in control of which user styles can be changed and provide explicit support for instead of opening the door to any CSS changes that are possible with this approach
See also https://www.hyrumslaw.com/.
@2025-04-06 The latest solution is to use the Custom UI Style plugin. For specific setup methods, please refer to https://github.com/subframe7536/vscode-custom-ui-style/issues/41.
Here are my steps:
- install the Custom UI Style extension in Vscode
- Set similar code as below in settings.json.
"custom-ui-style.webview.stylesheet": {
"h2": {
"color": "#ff6f61"
},
}
Then it works