How to Open & Live Preview HTML,CSS & JS Files in Default Browser in VSCode IDE Editor
Jul 9, 2025
Get the full source code of application here:
Show More Show Less View Video Transcript
0:00
Uh hello guys, welcome to this video. So
0:02
in this video, I'll show you a VS Code
0:05
extension which allows you to open and
0:07
live preview your HTML, CSS and
0:09
JavaScript files
0:11
uh with live preview. So if you go to
0:13
extensions tab, just type here open
0:16
browser
0:17
preview. This is the extension here.
0:21
It's used by almost 2 million developers
0:23
and it's a very simple extension which
0:26
actually adds a capability to open your
0:30
directly your HTML files, CSS files and
0:32
JavaScript files directly in your
0:35
default browser. So this is the thing
0:37
you simply need to click the install
0:39
button to click the to install this
0:42
extension. So after you install it,
0:44
simply go to your HTML file and right
0:48
here if you right click you will see
0:50
this option addit
0:52
preview inside your default browser. So
0:55
whatever is your default browser it can
0:57
be Chrome, it can be Firefox. So if you
1:01
do this automatically your application
1:04
will open.
1:08
You will see that
1:10
Again,
1:14
if you do this, it will add this option
1:17
right here in the context menu and
1:19
automatically
1:22
you will now be able to edit file. If I
1:25
change the background color
1:36
just refresh.
1:47
So as you can see as I'm adding this
1:49
content it can be JavaScript as well.
1:58
So it's a very basic extension but it
2:01
will save you a lot of time here because
2:03
it adds this option right in the context
2:05
menu preview in default browser or you
2:08
can even put the shortcut key Ctrl F1.
2:12
This is a shortcut key on the keyboard
2:15
but it adds this option here preview in
2:17
default browser.
2:19
So it basically opens it in a file
2:21
protocol.
2:25
So definitely install this extension.
2:29
Also check out my website
2:31
freemediatools.com
2:33
uh which contains thousands of tools.
#Software
#Internet Software
#Scripting Languages
