How do I create and open an HTML file in my web browser?

You'll be able to: Create an index.html file with starter HTML markup and preview it live in your browser

The steps

1. 1

   In VS Code, create a new file and save it with the name index.html. The file opens in your editor with an HTML tag icon next to its tab name.

   VS Code showing a new file named index.html with code ready.

   Screenshot on the way. The steps above are complete without it.

   Why name it index.html?

   Web browsers and servers recognize index.html by convention as the main homepage of any web project.

2. 2

   Type <h1>Hello World</h1><p>My first webpage.</p> inside the file and press Ctrl+S to save. The small unsaved circle indicator on the editor tab disappears, confirming your code is saved to your disk.

3. 3

   Right-click the index.html file in the VS Code file explorer sidebar and click Reveal in File Explorer. Windows File Explorer opens showing your index.html file highlighted with your default web browser icon.

   File Explorer showing the index.html file ready to double-click.

   Screenshot on the way. The steps above are complete without it.

4. 4

   Double-click the index.html file. Your web browser opens a new tab displaying your large "Hello World" heading and text paragraph with a local file:/// address in the URL bar.

It looks different on my screen

You can also install the popular "Live Server" extension in VS Code, which automatically refreshes your web browser every time you save your file.

Updated 2026-10-07اقرأ بالعربية