Can ChatGPT actually create a website?

If you want to build a website on your own, ChatGPT might be able to help you.

In this blog post, I'm going to try building a website with ChatGPT, sharing the process step by step. I'll use it for copy, design, and development. I have some intermediate experience building websites, so I'm hoping this process won't be too tough, but let's see...

Step one: Asking ChatGPT to help me

First things first, I asked ChatGPT what it can do, and I'm off to a good start. The software told me it can "Generate the complete code, including layout, styling, and interactivity. You can preview it in a browser or copy it straight into your hosting". I'm going to start small with a single-page, static site (I don't want to bite off more than I can chew).

For the purpose of this experiment, I'm creating this website for an imaginary florist. I asked ChatGPT how I can help it with web design ideas, and it asked for the following input...

Step two: Design input

• Name of the florist shop: I'm going with B's Buds

• Do you want a particular look or feel? (e.g. romantic and elegant, rustic and natural, modern and minimal): I decided modern and minimal, I want lots of white space and simplicity.

• Any colors or fonts in mind?: For simplicity I'm going to go with a Google font pairing, Amatic SC and Andika. I'm going to ask ChatGPT to pick the colour palette, based on an image that I like.

Once I'd fed all that back, I asked it what comes next, which is the planned sections/layout.

Step three: Layout and sections

In the words of the bot itself, we're going to "Keep it simple and effective for now. Here's a suggested structure for your single-page site":

1. Hero section: Name, tagline, background floral image, CTA button

2. About us: Short paragraph about B and the style of the arrangements

3. Our services: Small bouquet, event flowers, subscriptions, delivery

4. Gallery: (Optional placeholder images)

5. Contact: Phone, email, location, social links or contact form

I asked it to write the text based on its suggested layout. Normally, I'd prefer to do this myself, but for the purpose of this experiment, I'm trying to use the Artificial Intelligence bot to do as much as possible, so it's going to help me with website content creation too.

It came back with the following text...

Step four: Website copy

"Here’s the full website copy for B’s Buds, following the single-page layout we agreed on. Tone: warm, friendly, a little playful but still professional".

Hero Section

Header:
B’s Buds

Tagline:
Fresh flowers. Big heart. Local blooms with personality.

Button (CTA):
Browse bouquets

About us

At B’s Buds, flowers aren’t just pretty — they’re personal.
Whether it’s a wild, whimsical bunch or a soft, romantic bouquet, we believe every stem should say something special.

Founded by B (yes, that’s really the name), we bring bold colour, gentle charm, and a whole lot of care to everything we make. Think hand-tied, garden-inspired, and completely unique.

Our services

Everyday bouquets
Fresh, seasonal bunches — hand-tied and ready to brighten your day.

Weddings & events
From buttonholes to full floral arches, we’ll help you bloom on your big day.

Flower subscriptions
Love fresh flowers? We’ll deliver a new bunch every week, fortnight or month.

Same-day delivery
Need something today? Order by 2pm and we’ll make it happen.

Gallery

(We can use placeholder images here if you're not providing your own)
Simple headings for now, e.g.:

• Spring favourites

• Wedding highlights

• Statement bouquets

Contact us

We’d love to hear from you — whether you’re after a bunch for a friend, planning something big, or just want to talk tulips.

Phone: 01234 567890
Email: hello@bsbuds.co.uk
Location: Based in [Your Town], UK – delivering locally and beyond
Socials: @bsbuds on Instagram & Facebook

It's not a bad start for an imaginary florist shop, so I'm going with it. The next step is turning this into a fully coded HTML/CSS single-page site, using my fonts, colors, and copy.

Step five: The HTML code

Next comes the part I would have no idea how to do on my own. Writing the code.

When you (or anyone) builds a website, there are a couple of ways to go about it. You can either use a builder like Framer, WordPress, or Wix, which takes care of all of the code for you, giving you drag-and-drop components to build with. Or, you can hard-code it.

There are pros and cons to each.

Hard coding

Pros

• Full control: You control every line, layout, animation, SEO markup, performance, etc.

• Lightweight & fast: No bloated plugins or scripts; great for performance and loading times.

• No platform limits: You’re not locked into a system or forced to work around their tools.

Cons:

• Manual updates: Every change (text, images, etc.) requires editing the code and re-uploading.

• No CMS: There’s no built-in way to manage content unless you build one.

• Steeper learning curve: You need some coding knowledge (or a developer) to maintain it.

Best for: Simple static sites, landing pages, personal projects, developers who want full control.

Site builders

Pros:

• Visual editing: Drag-and-drop interface. You can design without writing code.

• Content management (CMS): Clients or non-devs can update text/images easily.

• Plugins and integrations: Easily add contact forms, calendars, ecommerce, etc.

• Themes and templates: Jumpstart design with pre-made components.

Cons:

• Heavier pages: Builders often add unnecessary code/scripts, which means slower performance.

• Less flexibility: Custom layouts or animations may be harder or require plugins.

• Ongoing maintenance: Especially in WordPress, plugin updates, backups, security, etc.

Best for: Blogs, marketing sites, ecommerce, or sites managed by non-technical users.

Now that we've cleared that up, let's look at what ChatGPT has created. It's given me all the code in the chat, so I need to add it to an HTML file to be able to preview it.

Step six: Using the code to create the visual site

This bit I was a little unsure of, but it turned out to be easy. I copied all of the code from within the ChatGPT chat and pasted it into a TextEdit file on my MacBook (you could also use Sublime Text). I then saved it onto my MacBook desktop as an .html file (this bit is super important).

Next, the scary part. Opening the HTML file in my browser, this is how you see what the actual design looks like...

Step seven: Viewing in the browser

I had to do some playing around with my MacBook settings here to make sure it was saving the TextEdit file in the right format, to be able to open it correctly in the browser. But eventually, it worked.

The result, however, was not as great as I was hoping. The next bit was also a bit tricky. I could view the web page locally on my own browser, because the file is saved to my desktop. But to make this page 'live' so that real people can see it, I needed to host it on a server.

Luckily, we have our own server and hosting plan, so we were able to do this. But if you're not technical, I think this part would be a struggle.

You can see ChatGPT's design here: B's Buds.

It's not the prettiest. The design elements are nonexistent; it's not a responsive design, so it doesn't display properly on mobile, and I would need to do a bit of manual work to make everything look how I want it to.

So, can ChatGPT actually create a website?

Short answer, yes, I could use ChatGPT to create me a website. It also helped with content ideas and the content creation process. It then gave me all the basic HTML code I needed to make that website 'live' online.

The long answer is a little more complex...

There was quite a lot of human input needed to make the website live online, so that other people could see it, and it required a bit of technical knowledge.

Also, putting it bluntly, it looks terrible. If anyone landed on my florist site, I don't think they'd be ordering anything. And the amount of work I would need to do to make it look even half decent has put me off continuing this experiment.

Onto plan B. As I already mentioned, the other alternative to using code to build a website is using a website builder. I'm going to try Framer and see what that can do.

Using Framer for my floristry website

I'm going to use a free website template from Framer as a starting point, and (hopefully) customize this so it has the look and feel I'm aiming for.

Aiming for something clean and minimal, so that I don't have to do too much customization, I chose Hoffen, a clean, typography-based portfolio template crafted specifically for AI artists, photographers, and designers. I clicked 'Use for free' and the design popped up in my Framer account, ready to be customized.

Step one: Adding my copy

To make it a fair comparison, I'm still going to use the copy ChatGPT generated for me.

I added everything into the sections that were already there. So I didn't need to do any bespoke work or custom code, just a bit of human editing.

Step 2: Editing the design

Figma is really user-intuitive. If you want to edit a picture, you click on the picture and upload your new one.

If you want to edit a color, you click on the background or the writing and select your new color. Same with changing fonts. It was all easy to find and update.

Step 3: Optimization

Framer gives you three side-by-side views for desktop, tablet and mobile, so you can tweak each one as you go along to make sure it's optimized for any device and screen size.

Step 4: Launch

The last step is launching it and making it live online. This part is not my forte, so I needed to call on my resident website developer to help with this bit.

But here it is, live and online so you can have a play around with it.

ChatGPT vs Framer

In the space of around 4 hours I was able to create both of these websites, one using ChatGPT and one using Framer, and also write this article about the experience. So, in terms of time spent, both options are pretty speedy.

In terms of ease of use, on the surface level, ChatGPT might be a little easier. You just tell it what colors, fonts, and copy you want, and it creates the whole design. However, customizing further from there is a little trickier.

Unless you are experienced in web design and can guide the AI bot through exactly what you want to change, ChatGPT prompt by prompt, where do you start? You would need to know about all kinds of things, like padding, pixels, font size best practices, etc.

So for me, when we're talking about design, Framer is the clear winner. Being able to choose from templates meant the website was already on the right foot, from the start. Plus, the customization was easy. Granted, neither web page will be winning any awards, but I would say the Framer version is miles ahead of the ChatGPT version.

When it comes to launching the site, Framer is again a winner here. In just a few clicks of a button, the site was live and hosted on our internal server.

Other AI website builder tools

ChatGPT isn't the only AI website builder tools, others on the market might help you. AI website builders use artificial intelligence to automate website creation, allowing users to build sites quickly with minimal technical knowledge.

A few no-code editor options below...

Relume.io

Relume is one of the fastest ways to build a website with AI. You can generate sitemaps and wireframes, then export them into Figma and Webflow.

Chariot

Chariot explains itself as "Chariot is an AI web developer. Describe the website you want and Chariot will build it for you. No code required." Just tell Chariot what your website is about, review and refine the output, then publish your new website instantly. It's (apparently) that easy.

Jimdo

Jimdo is pretty similar, "Build a successful website with Jimdo in no time: simple, easier, faster." The platform is free with some paid upgrades.

Ready to start your new website?

Whether you decide to brave it and use ChatGPT, figure out a drag and drop builder like Framer, or leave it completely to a professional web development company, good luck with your next project!