Can ChatGPT actually create a website?

Ask for a landing page and you get a landing page. The code runs, it opens in a browser, and it mostly holds up on a phone.

So the answer is yes. Then comes the second request, when the site already exists and you want one part of it different.

What it's good at

From an empty folder, a model writes the markup, the stylesheet and the small pile of glue between them faster than you can open your editor. It scaffolds a project in your framework, wires up the contact form, and writes media queries that hold to one spacing scale for the length of a file. The output is plain, conventional code, which is the compliment it deserves. Paste an error back and it usually fixes it in a turn.

For a personal site or a small internal tool, that's a real answer rather than a demo. Sites written this way are running in production and nobody visiting them can tell.

The first version is the easy one

Everything a model builds from scratch is a version one, and version one is the only one where every requirement is in the prompt.

A blank file has no opinions to respect.

Your site is version forty. There is a framework, a stylesheet with rules that were argued over, components with names, breakpoints somebody picked for a reason, a header that four other pages lean on. A request against that isn't "build a pricing page". It's "make the pricing cards line up on tablet without touching the layout every other page uses", said to something that has read a fifth of the code and is inferring the rest.

That's the request that comes back wrong. Not because it can't write CSS. Because that was never the hard part of the job.

It can't see the page

The model knows the code it wrote. It has no idea what your browser did with it.

It can't see that the third plan name is a word longer than the other two, so one pricing card wraps and stands taller than its neighbours. It can't see the old rule in a shared stylesheet quietly outranking the one it just added. It has no way of knowing that the button it moved sits below the fold on a laptop.

You're describing a page to something that has never looked at it.

Screenshots close less of that gap than people expect. A picture shows the result you're unhappy with. It doesn't show which rule produced it, and it says nothing about the width you didn't capture.

Describing a layout is the expensive part

Anyone working this way knows the loop. Bigger. Then smaller, then up a bit, then too far, then back to how it was two messages ago.

Words are exact about logic and vague about position. "Under the heading, aligned with the card below it, about one line of text away" is a long sentence and still ambiguous. Dragging the thing where it goes takes a second and leaves nothing to interpret. That's the whole argument of why describing became the expensive part: building got cheap and describing didn't.

Which complaints are fair

"ChatGPT can't build a website" is four complaints wearing one coat, and two of them don't survive contact.

The code is bad: mostly it isn't. It is ordinary and it works, and plenty of hand-written production CSS is worse. It has no taste: neither does a brief. Taste was your job before any of this arrived, and blaming a model for not knowing what you wanted is blaming it for not being you.

The other two are fair, and they're the ones that cost real hours. It drifts from your conventions, rebuilding a component you already have and adding a fourth blue to a palette that had three. And it can't check its own work, so what comes back is what it believes it wrote rather than what the browser shows. On a codebase that already exists, both of those turn into review time, and review time is what the speed was supposed to buy you.

Show it instead

If the page runs in a browser, you can stop describing it and point at it.

That's what Pixy does. Add the script tag or the Chrome extension, press ⌘⇧E, and the page in front of you becomes editable. Your CSS, your server response, your logged-in state, your real content. Move the heading where it belongs. Pull the frame in to 390 pixels and fix the phone layout at the width where it's actually broken.

Each change is recorded as what it was: the element, the property, the value before, the value after, and the width you made it at. Whatever you try and undo stays in the browser, so only the changes you keep reach your agent. Press Copy AI and you get the handshake to paste into ChatGPT, or into whichever agent has your project open. It pulls the list and writes the change in your code, in the terms your codebase already uses.

Design mode is off until you turn it on, and turning it off puts the page back exactly as it was.

How to actually do it

ChatGPT can create a website, and the emptier the starting point the better it does, so start it there.

1. Say what the site is for, and name the stack
   The job of the page and who reads it, before a word about how it should look. Left alone it picks the framework for you, and it picks whatever was most common in the code it learned from.
2. Give it your real content
   The actual headline, the real product names, the testimonial at the length your customer wrote it, six nav items instead of four. Ten minutes of work, and the step nearly everyone skips.
3. One page at a time, and read what comes back
   A five page site in one answer is five pages nobody has read, and a mistake you miss on the first is in the other four by the time you find it.
4. Get it running before you ask for anything visual
   A route that renders is enough. Everything after that point is a change to something real, which is where the describing starts to cost you.

That last step is the one that changes the rest. A page on localhost is all Pixy needs, and from there the site is the thing you point at rather than the thing you describe.

Next time an answer comes back slightly wrong, stop retyping the request. Open the page from your projects, press ⌘⇧E, and move the thing yourself.