How to build a website with an AI chat

You can build a complete website here by describing it in plain words — no account, no coding experience, and no payment. This guide shows you how, from the first sentence to a folder of files you can upload anywhere.

Start with a plain description

Open the chat page and describe the website you want, the way you would describe it to a person. Say what it is for, who it is for, and which pages and sections it needs. For example: "Build me a complete multi-page website for a small bakery, with a homepage, a menu page and a contact page. Warm colours, friendly tone, opening hours and a contact form." The more specific you are, the closer the result is to what you imagined — name the pages, the colours, and the sections you want. You do not need to know any code, and the chat will not ask you four questions back; it picks sensible defaults and builds straight away.

What you get back

You get a project folder with complete working files — not fragments and not a toy example. A bakery website comes back as separate pages and files, for example index.html, menu.html, contact.html, css/style.css and js/app.js, each complete and linked together. The reply shows the folder as a file tree: every file has Copy and Download buttons, and a Download all (.zip) button saves the whole folder with its structure intact. If the reply includes a complete HTML page, Preview and Download .html buttons appear under the message — Preview opens the page in a safe sandboxed window on this site, so you can see it before you download anything.

Step by step

Describe the site. One or two sentences: what it is, who it is for, which pages it needs.
Read the files. Check the folder tree in the reply. Each file is complete — open a file's Copy button if you want to look at the code.
Preview it. Use Preview on the main page to see the design in your browser. If something looks wrong, say so in the chat.
Ask for changes. Keep chatting in the same conversation: "Make the header dark blue", "Add a photo gallery", "Put the prices in a table". Each change builds on the last version.
Download the zip. When you are happy, use Download all (.zip). Unzip it and you have the project folder, ready to upload to your own hosting or edit in any text editor.

What to ask for

Good requests name the pages, the sections, and the look. "A portfolio website for a photographer, with a homepage, a gallery page and a contact page, dark theme, large photos" works better than "make me a website". Ask for real features, too: a menu with prices, a contact form, a FAQ section, a footer with opening hours. If you only want one page — say so: "a single-page website" — otherwise the chat builds a multi-page site by default. And if a reply ever stops before the code is finished, just say "continue" and it picks up where it stopped.

What the chat cannot do for you

Be clear about the limits. The chat gives you the files; it does not put them on the internet for you. You still need your own hosting and domain if you want the site live — the downloaded zip is yours to upload wherever you like. It also cannot build a backend for you here: no database, no user accounts, no payment processing inside the chat. A contact form in the generated code is a front-end form — to receive its messages you need a form service or a server of your own. And AI-generated code can contain bugs: always preview it, click through the pages, and test the form before you publish.

Tips for better results

Change one thing at a time. "Make the header blue" then "Add a gallery" works better than five changes in one message.
Name colours and style. "Warm brown and cream, friendly" beats "nice design".
Use real content. Give your business name, your real opening hours, your real prices — the site will use them instead of placeholders.
Keep the same chat. Follow-ups in the same conversation build on the last version; a new chat starts from scratch.

A worked example: the bakery site, message by message

Here is what a real build looks like, step by step, using a small bakery as the example:

First message: "Build me a complete multi-page website for a small bakery called Sweet Crumb, with a homepage, a menu page and a contact page. Warm brown and cream colours, friendly tone, opening hours Monday to Saturday 8am to 6pm, phone number 0300-1234567." The reply comes back with a folder: index.html, menu.html, contact.html, css/style.css and js/app.js, each complete.
Preview: Tap Preview on index.html. The homepage shows the bakery name, a short welcome, and links to the menu and contact pages. If the layout looks right, move on; if not, say what to change before going further.
First change: "Make the header dark brown and the buttons cream." One small change, one reply, one preview to check it.
Second change: "Add a photo gallery section to the homepage with six pictures." The chat adds the section and the code for it.
Third change: "Put the menu prices in a table with two columns: item and price." The menu page is updated, and the rest of the site is untouched.
Download: When the site looks right, use Download all (.zip). Unzip it and you have the whole project folder, ready to upload to your hosting or edit in a text editor.

The pattern is always the same: one clear first message, then small changes, one at a time, checking with Preview after each one. Big projects are built this way too — a five-page site is just a bakery site with two more pages, asked for the same way.

Choosing colours and style

You do not need to know design to get a good-looking site. Name a mood, not a colour code: "warm and friendly", "clean and professional", "dark and modern", "bright and playful". Add one or two colours if you have a preference: "dark blue and white", "green and cream". The chat picks sensible shades and uses them consistently across every page. If you do not like the result, say so in plain words — "make it brighter", "use a darker header", "make the text larger" — and the chat adjusts. Avoid asking for five style changes in one message; change the colours first, check the preview, then change the layout.

Adding images and real content

A website with real content always looks better than one with placeholders. Give the chat your real business name, your real opening hours, your real prices, and your real phone number in the first message — it will use them everywhere instead of writing "Your Business Name" and "Lorem ipsum". For images, the generated code will include placeholder image links you can replace with your own photos after downloading: swap the image file names for your own files, keeping the same file names, or edit the image links in the HTML. Keep your images reasonably small — a photo under 500 KB loads far faster than a 5 MB original — and give every image a short descriptive file name like "chocolate-cake.jpg" instead of "IMG_2041.jpg".

Common problems and how to fix them

The reply stops halfway through the code. Say "continue" and the model picks up where it stopped. This happens with large projects; it is normal, not a failure.
The preview looks different from what you described. Say exactly what is wrong in one sentence: "The menu is on the left, I want it at the top." Vague complaints get vague fixes.
A page link goes nowhere. Say "The contact page link on the homepage does not work, please fix it" and the chat will correct the link. Check every link in the preview before you download.
You asked for a change and the whole site changed. This usually means the request was too broad. Ask for one change at a time, and name the page: "On the menu page only, make the prices bold."
The code has a bug. Copy the error message from your browser and paste it into the chat with the file name: "index.html shows this error in the console: Uncaught ReferenceError: menu is not defined." The chat can usually fix its own mistakes when it sees the exact error.

Start simple, then grow

If you have never built a website before, do not start with a ten-page shop. Build a small three-page site first — a homepage, one content page, and a contact page — and finish it properly: preview every page, fix every link, download the zip. The second site will take half the time, because you will know the rhythm: describe, preview, change one thing, preview again, download. Each project teaches you a little more about what to ask for, and your prompts get better with every build.

After the download

The zip is a normal project folder: open it in any text editor to change text, colours, or pictures, and upload it to your hosting to go live. If you want more pages later, come back to the same chat and ask — "Add an About page" — and download the updated folder. For prompting advice, read how to write better prompts, and for the beginner walkthrough, see how to use OpenChatGPT.