HTML preview: see your page as you type

How to use it

1. Edit the example, or paste your own code. The HTML box takes a whole page or just the part inside <body>. The CSS box is applied to the preview automatically.
2. Check it at phone width. Most visitors arrive on a phone. If the text runs off the side, add <meta name="viewport" content="width=device-width, initial-scale=1"> to your page’s <head> (the preview adds it when you paste body-only HTML).
3. Download the files. You get index.html and style.css. Keep them in one folder with your images.
4. Upload them. In DirectAdmin’s File Manager, open public_html, delete the default index.html and upload yours. Upload a website, step by step.

Your work is kept in this browser between visits, so you can come back to it. It isn’t stored anywhere else.

Why scripts don’t run here

The preview is sandboxed: JavaScript is switched off. That makes it safe to paste code you found online without it doing anything to your browser. To test JavaScript, upload the page to a hosting account or open the downloaded file in your browser.

Next steps

• New to HTML? Build your first page from scratch explains every tag in the example.
• Want a head start? The free HTML starter templates are complete, responsive pages you can edit here.
• Not sure where your files go? What public_html is for.
• Hosting a whole HTML site? HTML website hosting covers folders, uploads and contact forms.