Projects › Web pages › Wedding website

Make your own free wedding website with AI

No subscription, no platform branding, no ads on your page. Have a look around the example below, then make one that's entirely yours in about an hour.

Starter 45 to 90 minutes Free · nothing to install RSVPs to your own Google Sheet

An example for a made-up couple, built with the prompts below. Your own photos go where the green boxes are.

Watch it come together, start to finish
What you'll build

A wedding website that's entirely yours

You'll describe the site to a free AI assistant, paste what it writes into a file, and open it in your browser. Your photos, your colours, your words.

  • A one-page website with your names, date and a countdown to the big day
  • Your story, photos, and the day's schedule
  • Venue details with an embedded map and travel and hotel tips
  • Dress code and FAQs ("Can I bring a plus one?", "Is there parking?")
  • An RSVP button connected to a free Google Form, with answers landing in a Google Sheet
  • A look that matches your invitations, and a layout that works on phones (most guests will open it on one)

Good for: couples who want something personal without a monthly fee, anyone organising a big birthday, reunion or christening, and the friend who's been "volunteered" to sort out the website.

Before you start

What you need

A free AI chat assistantClaude, ChatGPT or Gemini. The free versions are enough.
A plain text editor and a browserNotepad on Windows, TextEdit on a Mac (choose Format › Make Plain Text first).
A Google accountFor the free RSVP form. Answers land in a Google Sheet only you can see.
Before you start

Gather your details

The AI can only use what you give it. Open a note and jot down:

  • Your names and how you'd like them written ("Sam & Alex")
  • Date, start time, ceremony and reception venues with full addresses
  • The schedule (ceremony, drinks, dinner, first dance, carriages)
  • Dress code
  • RSVP deadline
  • 5 to 10 questions guests usually ask (parking, children, dietary needs, gifts, accommodation)
  • 2 or 3 sentences about how you met
  • Your colours, or a photo of your invitation

You'll paste this into the prompt in Step 1.

New to saving files like this? Read How to save and open an HTML file first.
Step by step

Build it in six steps

  1. Ask for the website

    Copy this prompt, fill in the bits in [square brackets], and paste it into Claude, ChatGPT or Gemini:

    Copy this prompt
    I don't know how to code. Please make me a wedding website as ONE single HTML file (HTML and CSS together, no external libraries except Google Fonts) that I can save and open by double-clicking.
    
    Style: elegant and romantic, [soft sage green and cream / navy and gold / your colours here], with a script font for our names and a clean, easy-to-read font for everything else. It must look good on phones as well as computers.
    
    Sections, in this order, with a simple menu at the top that scrolls to each one:
    1. Hero: our names, the date, the town, and a live countdown (days, hours, minutes) to the wedding
    2. Our story
    3. The day: a schedule as a simple timeline
    4. Venue and travel: addresses, a space for a map, parking and hotel suggestions
    5. Dress code
    6. FAQs, each question expanding when clicked
    7. RSVP: a big button that will link to a form (use # as the link for now)
    
    Here are our details:
    [Paste your notes here]
    
    Please give me the complete file in one code block.

    Copy the code the AI gives you, paste it into Notepad (Windows) or TextEdit in plain text mode (Mac), and save it as index.html in a new folder called wedding-site. Double-click it to see your website.

    Why index.html? It's the name web hosts look for as a site's front page, which makes putting it online easier later.
  2. Add your photos

    Put your photos in the same wedding-site folder. Give them simple names with no spaces, like hero.jpg, us1.jpg, us2.jpg, us3.jpg. Then:

    Copy this prompt
    Please add photos to the site. They are in the same folder as the HTML file:
    - hero.jpg should be a full-width background behind our names in the hero section, with a soft dark overlay so the text stays readable
    - us1.jpg, us2.jpg and us3.jpg should appear as a neat gallery in the "Our story" section, with rounded corners, side by side on computers and stacked on phones
    
    Send me the complete updated file.
    Tip: photos straight from a phone can be huge, which makes the site slow. Ask the AI "How do I make my photos smaller without losing quality?" and it will point you to a free tool.
  3. Add a map

    1. Go to Google Maps and search for your venue.
    2. Click Share, then Embed a map, then Copy HTML.
    3. Paste it into this prompt:
    Copy this prompt
    Please put this Google Maps embed into the Venue section, full width, with rounded corners, and make sure it resizes properly on phones:
    
    [paste the embed code here]
    
    Send me the complete updated file.
  4. Set up RSVPs with a free Google Form

    Your website is a single file with no server behind it, so it can't store RSVPs by itself. A free Google Form does that job, and every answer lands in a Google Sheet that only you can see.

    1. Go to forms.google.com and start a blank form.
    2. Not sure which questions to ask? Ask the AI:
    Copy this prompt
    I'm making a Google Form for wedding RSVPs. Please suggest the questions and answer types (short answer, multiple choice, etc.) I should use. We are [serving a choice of 3 meals / not asking about meals], [inviting / not inviting] children, and need to know about dietary requirements. Keep it short and friendly.
    1. Build the form, then in the Responses tab click Link to Sheets so answers go into a spreadsheet.
    2. Click Send, choose the link icon, tick Shorten URL, and copy the link.
    3. Give it to the AI:
    Then try
    Please make the RSVP button open this link in a new tab: [your form link]. Also add the line "Please reply by [date]" under the button.
    
    Send me the complete updated file.
  5. Make it feel like you

    Small touches make the site memorable. Pick any of these:

    Copy this prompt
    Please add these touches to the website:
    - A gentle fade-in as each section scrolls into view
    - A small heart or [our initials] logo in the menu
    - A "Add to calendar" button that downloads a calendar file for the wedding date and time
    - A short message at the bottom: "We can't wait to celebrate with you. [Names] x"
    
    Send me the complete updated file.

    Want it to match your stationery exactly? Upload a photo of your invitation and ask: "Please restyle the website so its colours and fonts match this invitation as closely as possible. Send me the complete updated file."

  6. Put it online

    Right now the site only lives on your computer. To share a link with guests, you need to put it online. Two free options:

    • Netlify Drop (easiest): go to app.netlify.com/drop, sign up for free, and drag your whole wedding-site folder onto the page. You'll get a web address within seconds.
    • GitHub Pages: a little more setup, very reliable.

    Our Putting your project online for free guide walks through both. Want your own address like samandalex.com? The same guide shows how to connect one.

    Privacy tip: if you'd rather your site doesn't appear in Google, ask the AI: "Please add a tag so search engines don't list this page." Share the link only with guests.
ADVERTISEMENT · IN-ARTICLE
If it goes wrong

Quick fixes

Photos don't show up

Check the file names match exactly, including capital letters and .jpg vs .jpeg vs .png. The photos must be in the same folder as index.html.

It looks fine on my computer but squashed on my phone

Tell the AI:

Copy this prompt
On my phone, [the names are cut off / the schedule overflows the screen]. Please fix the layout for small screens and send me the complete updated file.
The AI changed something I liked

Keep numbered copies (index-v1.html, index-v2.html) before each change, and tell the AI: "Keep everything else exactly the same, only change [X]."

The page is blank or half-finished

The reply was probably cut off. Check the code ends with </html>. If not, ask the AI to send the complete file again.

Make it your own

Twist it into something else

The same steps work for any event with guests:

Milestone birthday or anniversary party

, with a photo timeline through the decades

Baby shower

, with a "guess the date" form

School or family reunion

, with a "where are they now" section

Charity fun-run or fundraiser

, with a donate button and a progress bar

Hen or stag weekend

, with the itinerary and who's in which room

After the wedding, ask the AI to turn the site into a thank-you page with your favourite photos. Guests love it.

Why build it yourself?

It's yours, and so is your guest list

It's yours. No platform branding, no adverts on your page, no subscription to remember to cancel, and your guest list sits in your own Google account. You also end up with a skill you can reuse for every party, club and side project from now on.

Keep going

What to build next