How to Open an HTML File in Chrome (4 Easy Methods)

5 min read

Learn how to open HTML files in Chrome browser. Step-by-step guide covering drag-and-drop, file menu, keyboard shortcuts, and online HTML viewers.

Try it yourself

Use our free html viewer tool to do this instantly — no signup required.

HTML Viewer

Need to view an HTML file in your browser? Chrome makes it easy to open local HTML files for testing, previewing, or viewing web pages offline. This guide shows you four different methods.

Method 1: Drag and Drop (Easiest)

The simplest way to open an HTML file in Chrome:

  1. Open Chrome browser
  2. Open your file explorer/finder
  3. Find your HTML file
  4. Drag the file into Chrome
  5. Drop it in the browser window

The HTML file will open immediately in a new tab.

Method 2: File Menu

Use Chrome's built-in file menu:

  1. Open Chrome
  2. Press Ctrl+O (Windows) or Cmd+O (Mac)
  3. Navigate to your HTML file
  4. Select it and click "Open"

Alternatively:

  1. Click the three-dot menu (⋮) in Chrome
  2. Select "Open File..."
  3. Browse to your HTML file
  4. Click "Open"

Method 3: Address Bar

Type the file path directly:

  1. Open Chrome
  2. Click the address bar
  3. Type: file:/// followed by the path
  4. Press Enter

Example paths:

  • Windows: file:///C:/Users/Name/Desktop/page.html
  • Mac: file:///Users/Name/Desktop/page.html
  • Linux: file:///home/name/Desktop/page.html

Method 4: Use an Online HTML Viewer

For a better viewing experience with syntax highlighting:

  1. Go to LinkyHost HTML Viewer
  2. Upload or paste your HTML code
  3. View rendered output and source code
  4. Share with others via link

Benefits of online viewers:

  • Syntax highlighting
  • Easy sharing
  • Works on any device
  • No local file access needed

How to Open HTML Files in Chrome on Different Devices

Windows PC

Drag and drop:

  1. Open File Explorer
  2. Navigate to your HTML file
  3. Drag into Chrome window

Right-click method:

  1. Right-click the HTML file
  2. Select "Open with"
  3. Choose "Google Chrome"

Set Chrome as default:

  1. Right-click any HTML file
  2. Select "Open with" → "Choose another app"
  3. Select Chrome
  4. Check "Always use this app"

Mac

Drag and drop:

  1. Open Finder
  2. Locate your HTML file
  3. Drag into Chrome

Right-click method:

  1. Right-click (or Ctrl+click) the HTML file
  2. Select "Open With"
  3. Choose "Google Chrome"

Set as default:

  1. Right-click the HTML file
  2. Click "Get Info"
  3. Under "Open with," select Chrome
  4. Click "Change All..."

Chromebook

  1. Open the Files app
  2. Find your HTML file
  3. Double-click to open in Chrome
  4. Or right-click → "Open with" → "View"

How to Run HTML Code in Chrome

If you want to test HTML code (not just view a file):

Option 1: Developer Tools Console

  1. Open Chrome
  2. Press F12 or Ctrl+Shift+I
  3. Go to "Console" tab
  4. Type: document.write('<h1>Hello</h1>')
  5. Press Enter

Option 2: Create a Local File

  1. Open Notepad (Windows) or TextEdit (Mac)
  2. Write your HTML code
  3. Save as test.html
  4. Open in Chrome using methods above

Option 3: Use LinkyHost HTML Viewer

  1. Go to HTML Viewer
  2. Paste your HTML code
  3. See the rendered result instantly
  4. Share via link if needed

Troubleshooting

HTML File Opens as Text

If Chrome shows raw code instead of rendered HTML:

  • Check the file extension is .html or .htm
  • Ensure the file starts with proper HTML tags
  • Try right-clicking → "Open with" → Chrome

CSS/JavaScript Not Loading

When opening local HTML files:

  • External CSS/JS files must be in the same folder or use relative paths
  • Some features may be blocked due to security restrictions
  • Consider using a local server for complex projects

Images Not Showing

  • Use relative paths: <img src="images/photo.jpg">
  • Or absolute paths: <img src="file:///C:/path/to/image.jpg">
  • Check that image files exist in the specified location

Frequently Asked Questions

How do I open an HTML file in Chrome on my computer?

The easiest way is drag and drop. Open your file explorer, find the HTML file, and drag it directly into an open Chrome window.

How do I view HTML code in Chrome?

To view the source code of any page in Chrome, press Ctrl+U (Windows) or Cmd+Option+U (Mac). For your own HTML files, you can also use LinkyHost's HTML Viewer for syntax highlighting.

Can I edit HTML in Chrome?

Yes! Press F12 to open Developer Tools, then you can edit the HTML directly in the Elements panel. Changes are temporary and reset when you refresh.

How do I make Chrome the default for HTML files?

Right-click any HTML file, select "Open with" or "Get Info," choose Chrome, and set it as the default application.

Why won't my HTML file open in Chrome?

Check that: (1) the file has a .html extension, (2) Chrome is installed, (3) the file isn't corrupted. Try opening via File → Open or drag/drop.

Related Tools and Guides

Conclusion

Opening an HTML file in Chrome is straightforward - just drag and drop the file into your browser window. For sharing HTML files with others or viewing with syntax highlighting, try LinkyHost's HTML Viewer.