AI Website Builders02 August 2026

Wix Harmony Tutorial: How to Build Your First Website with AI


Learn how to build a professional website using the new Wix Harmony AI editor. Follow this step-by-step tutorial to create, customize, and publish your site today.

Building a website used to require hours of design work or expensive developers. The Wix Harmony editor uses AI to bridge the gap between complex design and simple, intuitive control. This tutorial walks you through every step — from your first prompt to a published site — based on a hands-on walkthrough of the editor.

What Is Wix Harmony?

Wix Harmony is Wix's AI-powered hybrid editor. Wix describes it as a tool that combines AI-powered generation with manual drag-and-drop design control. It sits alongside two other editor options in the Wix ecosystem: Wix Studio (aimed at professional designers) and the classic Wix editor (template-based, drag-and-drop).

The key difference with Harmony is that you describe what you want and an AI assistant called Arya builds the initial site for you. You then refine it visually without writing any code.

For a broader look at how Wix stacks up overall, see this Wix Review 2026: Is It Still the Best Website Builder?.

Getting Started with Wix Harmony

  1. Go to Wix and sign up for a free account.
  2. After signing up, you land on a screen where Wix asks you to choose your editor path: Wix Studio, Wix Harmony, or the classic editor.
  3. Select the Harmony editor to follow the AI-assisted path.
  4. You will then see the Wix dashboard — the back end where you manage messages, domains, invoices, and blog posts. This is largely the same across all Wix editor types.
  5. Click Design Site to enter the actual editor.

Once inside, you have two options: generate a site using AI or select a template to start manually. This tutorial focuses on the AI generation path.

Writing a Good Prompt for Arya

Before clicking generate, Wix prompts you with a short conversational setup. The AI asks what your site is about, what you want it to do, and what your main goal is. You can answer these questions or skip ahead by selecting "end this chat and continue."

After the setup chat, you reach the main prompt field where Arya will actually build the site. This step matters more than the chat — Arya uses the prompt to determine layout, sections, embedded content, and copy. A more detailed prompt produces a more relevant first draft.

In the tutorial walkthrough, the prompt included the site owner's name, their focus (software tutorials), and links to three specific YouTube videos to embed on the page. The prompt also could not include image uploads at this stage — photos had to be added after generation.

Tips for a stronger prompt:

  • State who the site is for and what it does
  • Mention specific content to embed (videos, portfolio items)
  • List key sections you need (contact form, about section, mailing list sign-up)
  • Specify tone or audience if relevant

Generating Your First Website

Once you click Generate, Arya builds the site. Based on the tutorial walkthrough, this process takes roughly 4 to 8 minutes depending on the complexity of the prompt.

The result is a fully structured prototype with placeholder and AI-written text, auto-selected images, and embedded content from any links you included. In the walkthrough, Arya produced a homepage with a hero section, an about section with AI-written copy, embedded YouTube videos, a contact form, and a logo. The hero image was a generic stock photo that could be replaced.

Customizing Content and Layout

After generation, every element on the page is editable. Clicking any element reveals a toolbar at the top with formatting and linking options.

Editing Text

  • Click directly on any text block to edit it inline
  • Use the top toolbar to change font, size, weight, and color
  • Highlight a word to apply a hyperlink to an external URL, an internal page, or a specific section on the same page
  • Add line breaks to adjust visual spacing

Replacing Images

  • Click an image and select Replace from the controls
  • Choose from the Wix media library, Unsplash stock photos, or upload from your own computer
  • Uploaded images are stored in your Wix media library for reuse

Editing Buttons

  • Click any button to edit the label text
  • Use the Link option to connect the button to a page, a section anchor, or an external URL — for example, scrolling down to the contact section when clicked

Managing Social Media Icons

  • Click the social bar to manage which platforms appear
  • Delete icons you don't use, reorder by priority, and add profile URLs for each platform
  • Orientation and spacing between icons can also be adjusted

Adding Sections

To expand the homepage or any page, click Add Section. You have three options:

OptionWhat It Does
Ask AryaDescribe a section and let AI design it
Design SectionsChoose from pre-built Wix templates (welcome, CTA, events, contact, store, team)
Blank SectionStart from scratch with no preset content

Sections can be reordered by clicking the up/down arrows on the section controls, or deleted if not needed.

Using Arya to Build New Pages

Arya is not just for the initial generation — you can use it throughout the editing process. In the tutorial, Arya was used to build a contact page via voice command. The spoken request asked for a contact page with an email form, opening hours, and a Google Maps preview of an office location.

Arya completed the contact page in approximately 4 minutes. It generated a page with a location block, opening hours, and a contact form. The address defaulted to San Francisco, but updating it was straightforward: clicking Manage Location, entering a new address, and the map updated automatically.

After Arya builds a page, you can still add more sections manually using the same section templates or AI prompts.

Creative professional designing a website at a modern desk

Managing the Navigation Menu

New pages built by Arya are not automatically added to the navigation menu. To add one:

  1. Click Menu in the editor
  2. Select Manage Menu
  3. Click Add Item and choose Site Page
  4. Select the page you want to add
  5. Drag to reorder menu items

You can also hide a page from the menu without deleting it by removing the menu link while keeping the page live on the site.

Adding Individual Elements

Beyond sections, individual elements can be added anywhere on a page. Click Add in the editor to access:

  • Text blocks — headings, paragraphs, labels
  • Images — from upload, media library, or Unsplash
  • Buttons — standard CTA buttons or specialized options like a PayPal donation button
  • Graphics and videos

Each element can be freely repositioned, resized, and linked after placing it.

Publishing Your Site

When the site is ready, click Publish. Wix assigns a free subdomain in the format

yourname.wixsite.com/sitename
. The site is immediately live and accessible to visitors, who can browse pages, click through content, and submit contact forms.

To use a custom domain instead, click Connect Your Domain in the dashboard. You can purchase a domain directly through Wix or connect one you already own.

How Does Wix Harmony Compare to Base44?

In the tutorial walkthrough, Base44 was briefly mentioned as an alternative. Both tools let you describe what you want to build in plain language. The noted differences from the walkthrough are:

  • Base44 allows image uploads at the prompt stage, before generation
  • The visual design output from Base44 was preferred in the comparison
  • Base44 is positioned more as a no-code app builder — it can build web apps as well as websites
  • Base44 is also owned by Wix, sitting alongside Harmony as a separate product

For a direct breakdown of the two tools, see Base44 vs Wix: Which AI Website Builder Should You Choose? or the in-depth Base44 Review 2026: Is This the Best AI App Builder?.

Wix Harmony: Strengths and Limitations

What works well:

  • Fast initial generation from a single prompt
  • Seamless switch between AI commands and manual editing
  • Arya can generate individual pages or sections on demand, not just the full site
  • Full drag-and-drop control after generation — no code required
  • Built-in media library with Unsplash integration
  • Voice input supported for Arya commands
  • Free to start — no credit card required to sign up and generate a site

Limitations to know:

  • Image uploads are not available at the initial prompt stage
  • AI-generated text will need editing before publishing — it invents placeholder copy
  • Generation takes 4–8 minutes per site or page build
  • Free plan publishes under a Wix subdomain; a custom domain requires a paid plan
  • Arya-built pages are not automatically added to the navigation menu

Recommendation

Wix Harmony is a practical starting point if you want to go from a blank slate to a structured, editable website in under 30 minutes without writing code. The AI handles the initial heavy lifting — layout, copy, section structure, and media selection — while the drag-and-drop editor lets you refine every detail afterward.

It is best suited for individuals, creators, and small businesses who want a functional site quickly and are comfortable editing AI-generated content. If your project leans more toward a web application or you want more design control from the start, Base44 may be worth comparing before committing.

Try Wix Harmony for free and see how far a single prompt can take you.

● FAQ

Frequently Asked Questions

Newsletter

Get the latest AI news & discount codes

Stay ahead with the newest AI tools, exclusive discount codes, and the best deals on top app builders — delivered straight to your inbox.

No spam. Unsubscribe anytime.



© 2026 Julian Weber · All rights reserved