VSCode IDE CSS Intellisense & Autocomplete Extension in HTML Source Code Full Setup Video
307 views
Jul 14, 2025
Get the full source code of application here:
View Video Transcript
0:00
Uh hello guys, welcome to this video. So
0:02
in this video, I'll show you how to
0:03
enable the CSS intellisense and
0:06
autocomplete for class names which you
0:09
have declared inside your CSS file and
0:12
in HTML source code. How to enable those
0:15
CSS autocomplete intellisense for class
0:17
names? So there is an extension in VS
0:19
code. Go to the extensions tab just
0:21
right here CSS intellisense and this
0:24
extension will come right here.
0:26
intellisense for CSS class names for in
0:29
HTML source code. So it has got almost 9
0:32
million installs. So it will save you a
0:35
lot of time. It will show you this
0:36
autocomplete suggestions for your CSS
0:40
class names which are declared inside
0:42
your stylesheets directly inside your
0:44
HTML code. So first of all just need to
0:48
enable this extension by clicking the
0:50
install button
0:52
and this will install this extension. So
0:54
after that simply go to your HTML file
0:57
here. So whatever uh CSS you have
1:01
declared right here. It can be custom
1:03
CSS. It can be included through third
1:06
party
1:07
link tag. So I've declared a bunch of
1:10
these classes. As you can see we have
1:13
this calculator class here which is
1:14
styling this. So now if I go to the HTML
1:17
and simply type this class here, it will
1:22
give me these suggestions. As I write
1:25
the class name, you will see
1:28
it will scan the entire document and
1:30
depending upon that
1:32
just wait for the extension to
1:34
completely load
1:37
and then you will see the suggestions
1:39
coming. So just after you click the
1:42
activate button simply give time.
1:50
So once you install this as you write
1:52
this class name here it will give you
1:54
suggestions
2:05
and same goes with any element. You
2:07
basically give the class attribute.
2:17
So I personally tried this extension. It
2:20
definitely works. For some reason I
2:21
think that it is not working for me
2:24
because it is not loaded properly. But
2:27
uh you can personally try this activate
2:29
this extension and this will show you
2:31
the intellisense and autocomplete
2:34
suggestions for all the class names
2:36
which you have declared inside.
2:44
So simply go to your HTML and
2:48
write here just give it
2:55
you can even restart your VS code as
2:57
well for the changes to take place. So
2:59
this is the class here which will show.
3:02
So
3:04
also check out my website
3:05
freemediatools.com
3:07
uh which contains thousands of tools.
#Programming
#Software