Why does my HTML file open as code (or a blank page) instead of a page?

You open an .html file that ChatGPT, Claude, or a friend made, and instead of a quiz or a game you get a wall of code, or a white page with nothing on it. Both have a short list of causes, and each cause leaves a sign you can check in a minute. This guide covers the code and the blank page. If the page opens but its pictures or styling are missing, read My HTML file opens but the images and styling are missing instead.

Sending a file you made? The upload box at the top of this page turns it into a preview link without an account. That preview runs no scripts, so a quiz or game won't respond there. Click Keep this page — free, no card and sign up, and the page moves into your account, where its scripts run and you can publish it.

Find your symptom

We tested each cause below on October 25, 2026, on a Mac with macOS 26.5.2, in Google Chrome 155.0.8059.85 with a fresh profile. The method is under each section.

It opened in a text editor or a preview

A text editor shows what is inside a file, and inside an .html file is code. Microsoft says Notepad can open any text document, and that is what you get: the code, not the page. Apple's TextEdit guide says TextEdit shows an HTML file "the same way a browser would (as formatted text)", unless Display HTML files as HTML code instead of formatted text is selected in TextEdit > Settings > Open and Save. With that setting on, you see the code.

Previews aren't browsers either. The ones we tested didn't show the code: they showed part of the page. Tapping an .html file in the iPhone Files app opened a Quick Look preview in our iOS 26.3 test, and Quick Look on a Mac did the same in our macOS 26.5.2 test. Both showed the text and the CSS and ran no JavaScript. Android's HTML Viewer app did the same in our Android 16 emulator test. Google's Drive help lists .HTML with .CSS and .JS under "Markup/Code" among the files Drive previews, but doesn't say whether that preview shows the page or its code. We didn't open an HTML file in Drive or Gmail. Google Drive and HTML files and sending an HTML file by email cover them.

One more editor-like view: Chrome's keyboard shortcuts list Ctrl + U (⌘ + Option + U on a Mac) to "Display non-editable HTML source code for the current page". If a tab shows code and its address starts with view-source:, close that tab. The page is in the tab you came from.

Fix: open the file with a browser. On a Mac, Control-click the file, choose Open With, and pick Chrome or Safari, as the Mac guide shows. On a phone, open the file in a browser through an HTML viewer, as the iPhone and Android guides show.

The file is really a text file

A file named quiz.html.txt looks like quiz.html when your computer hides the last extension, and a browser shows a .txt file as text. Apple says filename extensions "are usually hidden in macOS". We opened a full page saved as page.html.txt in Chrome 155. Every tag showed on screen, and the page's script didn't run.

To see the real name:

• Mac: in the Finder, choose Finder > Settings, click Advanced, and select Show all filename extensions. For one file, choose File > Get Info and deselect Hide extension under Name & Extension.
• Windows 11: in File Explorer, select View > Show > File name extensions. On Windows 10, select the File name extensions check box in the Show/hide group of the View tab.

Fix: rename the file so it ends in .html. Microsoft notes that changing an extension "won't convert the file to another format". That's fine here, because HTML code is plain text already. A Word or rich-text file renamed to .html stays a Word or rich-text file, so save the code as plain text instead, as the next section shows.

The code was saved as text inside a web page

A rich-text editor can save the code you pasted as the words of a new web page. Open that file in a browser and you see your code, because the code is now the page's text.

We tested TextEdit 1.20 on macOS 26.5.2. A new TextEdit document starts in rich text. We pasted a 13-line page into one and saved it with a name ending in .html. TextEdit switched the file format to a web page by itself and wrote its own HTML: each line of our code in its own paragraph, with every < written as <. Chrome 155 showed our code, line by line, and the quiz's script never ran.

Fix: Apple's TextEdit guide gives the steps for a real HTML file. Choose File > New, then Format > Make Plain Text. Paste the code, choose File > Save, and enter a name that ends in .html. When TextEdit asks which extension to use, click Use .html. We tested only TextEdit. Other rich-text editors may save the same way, so paste code into a plain-text editor.

The code isn't a whole page

Some AI answers give you a part of an app, not a page. A React component starts with lines like import { useState } from "react"; and has export default function. A browser can't run it as it is.

We saved a short React quiz component as quiz.html and opened it in Chrome 155. The browser showed the JavaScript as text, with "Capital cities quiz" and "Paris" mixed into it, and no button worked. Pasted into Convika's HTML viewer, it showed the same text.

A smaller slip: copying a chat's code block with its fence. A file that starts with ```html showed those characters at the top of the page and ``` at the bottom in our test. The rest of the page worked. Delete those 2 lines.

Fix: ask the AI for a page, not a component:

Give me the whole thing as one HTML file that runs in a browser when I open it: start with <!DOCTYPE html>, put the CSS in a <style> tag and the JavaScript in <script> tags, and don't use import, export, or a build step.

A link shows code instead of the page

Some links are to a file, not to a page. A link to a raw file on GitHub (raw.githubusercontent.com) came back as text/plain when we checked it with curl and in Chrome 155, and Chrome showed the page's code in plain text. Ask the sender for the address of the hosted page instead, or download the file and open it in a browser.

Why the page is blank

A blank page usually means the page is drawn by a script that didn't run. Games, React apps, and charts put almost nothing in the HTML itself.

The code was cut off. If the copy you saved stops partway through, the page can go blank. We saved a canvas game whose code stopped inside its <script> tag. Chrome 155 showed a white page, and its Console showed no error. The HTML standard says why: when a file ends inside a script, the parser marks that script as "already started", so it never runs. The complete version of the same file drew its game screen. Copy the code again down to the last </html>, or ask the AI to send the whole file again.

The page needs files from its folder. A built app's index.html that loads /assets/index.js as a module showed a blank page from disk. Chrome's Console said: "Access to script at 'file:///assets/index.js' from origin 'null' has been blocked by CORS policy". The same folder served from a local server ran. MDN, Mozilla's reference for web developers, says module scripts loaded from a file:// address "run into CORS errors" and need a server. The Mac guide's test shows what else is blocked from disk.

The page needs the internet. We made a quiz that loads React and Babel from a CDN. Online, Chrome showed the quiz. With the network off, the page was white, and the Console showed 3 failed downloads. In our iPhone test, a Quick Look preview loaded nothing from the web, so it can't draw such a page either.

Scripts are off. In Convika's HTML viewer with Run scripts off, the same React quiz was white too. That's useful: if a page is blank with scripts off and fine with them on, a script draws it.

To see the error, open Chrome's Console: Ctrl + Shift + J on Windows or Linux, Cmd + Option + J on a Mac, as Chrome's DevTools documentation lists. A red line names the file or the line that failed. No line at all, on a white page, can point to code that was cut off.

Buttons that do nothing

If the page looks finished but nothing responds, the app showing it doesn't run scripts. That's Quick Look on an iPhone or a Mac, and the HTML Viewer app on Android, in the tests linked above. Open the file in a browser instead.

Convika's HTML viewer runs scripts, but it walls the page off from convika.com, and that blocks a few things. We pasted a test page into a local copy of the viewer in Chrome 155:

• Pop-up boxes: alert() and prompt() did nothing. The Console said "Ignored call to 'alert()'. The document is sandboxed". A quiz that shows its answer in an alert box looks dead there.
• New windows: a link with target="_blank" and a window.open() call were both blocked.
• Saved data: reading localStorage threw a SecurityError, so a game that saves scores can stop at that line.

Opened from disk in Chrome 155, the same page showed both boxes, opened both windows, and saved its data. If a page works from your disk but not in the viewer, one of these is why.

Check the file in the HTML viewer in 4 steps

The viewer opens the file inside your browser and shows the same page with scripts on or off, so you can tell which kind of problem you have.

1. Open the HTML viewer

Go to the free HTML viewer. It needs no account. Your browser reads the file, and the file doesn't reach Convika's servers. If someone sent you the file, don't open a file you weren't expecting: ask the sender first, and turn off Run scripts before you choose a file you're unsure of.

2. Choose the file, or paste the code

Click Choose an .html file and pick it. The viewer opens .html and .htm files up to 2 MB, and turns down a .txt file you drop on it with "The chosen file's name does not end in .html or .htm." For a .txt file, open it in a text editor, copy all of it, choose Paste code, paste it, and click Show the page.

3. Turn Run scripts off, then on

With Run scripts off, you see the page's HTML and CSS only. A page that is blank with scripts off and works with them on is drawn by a script. A page that is blank both ways has code that was cut off, or needs files or a CDN it can't reach. A page that shows code both ways isn't a whole page, or was saved as text.

4. Read the line under the page

If the page points to files on your device, such as style.css or photo.png, the viewer lists them under the page. They can't show, because only the one file came with it. Files a script loads aren't listed. Missing images and styles covers what to do next.

Send a link instead of the file

If you're the sender, a link spares the other person every step above. They click it and the page opens in their browser, with its scripts running.

1. Drop the file into the upload box at the top of this page, or paste the code. You get a preview link in seconds, without an account. It works for 3 minutes, with scripts and forms off.
2. Click Keep this page — free, no card and sign up. The page moves into your account, and its scripts run in the dashboard preview.
3. Click Publish page. Under Who can open this page?, choose Public and click Next. The first time you publish, Convika shows Publish free, and under it Publish without the Convika bar, which opens an order for Pro monthly (1 day free with a card, then $12 a month). To publish on Free, click Publish free.
4. Copy the address under Live URL and send it instead of the file.

Convika hosts one HTML file per page, so put any style.css or app.js inside the page first.

Frequently asked questions

Why does my HTML file show code instead of a webpage?

Because something other than a browser opened it, or the file isn't a page. A text editor shows the code by design. A file whose name really ends in .txt shows as text in a browser. Code pasted into a rich-text editor can be saved as the text of a new page, and a React component isn't a page at all. Open the file in a browser, show file name extensions, and check that the code starts with <!DOCTYPE html>.

Why is my HTML page blank?

The script that draws the page didn't run. In our Chrome 155 tests, that happened when the code was cut off inside its <script> tag (with no error shown), when a built app loaded /assets/index.js from disk, and when React from a CDN couldn't load offline. Press Ctrl + Shift + J (Cmd + Option + J on a Mac) to see the error, and copy the code again through </html>.

Why does Google Drive show my HTML file as code?

Because Drive shows a preview of the file, not the page in a browser. Google's Drive help lists .HTML with .CSS and .JS under "Markup/Code" among the files Drive previews, and calls a preview "a scaled-down version of the complete file". It doesn't say whether that preview shows an HTML file's page or its code, and we didn't open one in Drive or Gmail. Download the file and open it in a browser or an HTML viewer, or ask the sender for a link to the page.

How do I tell if my file is really .html?

Show file name extensions. On a Mac, choose Finder > Settings > Advanced and select Show all filename extensions. On Windows 11, select View > Show > File name extensions in File Explorer. If the name ends in .html.txt, rename it to end in .html. Its code is plain text, so the rename is all it needs.

Why do buttons do nothing in my HTML file?

The app showing it doesn't run scripts, or the page uses something the viewer blocks. Quick Look on an iPhone or a Mac ran no JavaScript in our tests. In Convika's HTML viewer, alert(), prompt(), new windows, and localStorage are blocked. Opened from disk in Chrome 155, the same test page ran all of them.

Why does my HTML file open in TextEdit or Notepad?

Your computer opens .html files with that app. TextEdit and Notepad are text editors, so they show code or formatted text, not the running page. On a Mac, select the file, choose File > Get Info, pick a browser under Open with, and click Change All. To open just this once, use Open With and pick a browser.

Can I see the page if I only have the code?

Yes. Open the free HTML viewer, choose Paste code, paste everything from <!DOCTYPE html> to </html>, and click Show the page. Nothing is uploaded unless you press the viewer's upload button. If the code came from someone you don't know, turn off Run scripts first.

Sources

• Work with HTML documents in TextEdit on Mac (Apple) (checked October 25, 2026)
• Show or hide filename extensions on Mac (Apple) (checked October 25, 2026)
• Common file name extensions in Windows (Microsoft Support) (checked October 25, 2026)
• Choose an app to open a file on Mac (Apple) (checked October 25, 2026)
• Chrome keyboard shortcuts (Google Chrome Help) (checked October 25, 2026)
• Open Chrome DevTools (Chrome for Developers) (last updated December 14, 2018; checked October 25, 2026)
• Files you can store in Google Drive (Google Drive Help) (checked October 25, 2026)
• Reason: CORS request not HTTP (MDN) (last modified November 30, 2025; checked October 25, 2026)
• JavaScript modules (MDN) (last modified August 21, 2026; checked October 25, 2026)
• Parsing HTML documents, HTML Standard (WHATWG) (last updated October 22, 2026; checked October 25, 2026)