← Video Library · Gamma
We Built A Website Without Coding (No Code Website Builder Tutorial)
Published December 1, 2024 · 2,380 views on YouTube
Key takeaways
- Gamma can generate a full website from a single imported document (like a proposal doc), condensing the content and picking images automatically.
- New pages are built with the same repeatable generate flow used for the homepage, and can be edited afterward with 'Edit with AI' prompts.
- Themes carry style keywords that control AI-generated images, colors, and layout consistency across every page.
- Gamma has no native form builder or chatbot embed yet — the workaround is embedding a third-party form (Tally, Typeform) or a mailto button.
- Sites can go live on a custom domain through a built-in domain setup flow, and every edit stays private until you hit Publish.
How do you build a website with Gamma without coding?
Gamma builds a website by importing existing content — a Google Doc, a proposal, or typed notes — through its “Generate” flow, then using AI to write, lay out, and illustrate the pages. In this session, the Gamma design team imports a coffee-shop proposal doc, picks an image model (Ideogram or Flux) and a light or dark theme, and Gamma produces a working homepage in under a minute, ready to edit.
How does Gamma generate a website from a document?
Gamma reads the uploaded document, condenses the wording, and places the content into a themed page layout automatically. In the demo, Hillary’s proposal doc for a coffee shop (“Bean there, Brew that”) becomes a homepage with a hero section, description, and imagery without any manual writing — the presenter notes it “took what was in that Google doc and piped it through.”
Adding a second page (a menu) uses the same generate flow: pick “Add page,” describe it in a short prompt, and Gamma builds it in the site’s existing style. Content and sections can then be dragged into a different order — for example, moving “location and hours” above the menu items because it’s more important to a new shop.
How do you customize themes, colors, and images in Gamma sites?
- Pick a starting theme (color palette, e.g. “cream”) when generating the site.
- Use the “Edit with AI” panel on any block to request layout changes, such as turning a plain table into an icon-and-text layout.
- Regenerate individual images by clicking into them and adjusting the built-in style keyword (e.g. switching from photographic to “claymation”).
- To rebrand fully, open Customize > New Theme (build from scratch) or Customize on an existing theme to edit its image keywords, accent colors, and upload a logo.
- Optionally add custom prompt language for images (e.g. “cream, green, dark brown”) so every newly generated image on the site stays visually consistent.
One caveat raised in the demo: images generated under an earlier theme don’t automatically restyle when you switch themes later — the team currently uses an “Edit with AI: regenerate all images to match my current theme” workaround, since automatic detection of a theme change isn’t built yet.
How do you connect a custom domain to a Gamma website?
Domain setup lives in the site menu next to Publish. If you already own a domain, Gamma’s automatic setup verifies ownership through DNS, which the team says typically completes faster than the stated 24–48 hour window. If you don’t own a domain yet, Gamma offers purchasing one through a third-party partner (Ionos) without leaving the app. Site-wide settings — favicon, site name, nav bar visibility, and a Google Tag Manager ID for analytics — are managed under Site Settings, separate from per-page design.
Can you embed forms, videos, or a chatbot on a Gamma website?
Gamma has no native form builder or chatbot embed as of this recording. The demonstrated workarounds are:
| Need | Workaround shown in the video |
|---|---|
| Contact form | Build the form elsewhere (the demo uses a third-party embed) and paste it in via /embed, set display to “embed” |
| Quick contact option | Turn a link into a button with a mailto: address so clicking it opens a pre-addressed email |
| Booking / scheduling | Paste a Calendly link directly into a card; Gamma auto-detects the link type |
| Lead capture forms | Drag in a Typeform or Tally embed from the media picker |
| Video | Paste a YouTube or Vimeo link into a card, or into a gallery block for multiple videos as a carousel |
| Chatbot | Not supported — custom HTML/code embeds aren’t available; it’s a frequently requested feature tracked in Gamma’s public feedback tool, Canny |
Other features covered live: real-time collaboration and inline comments between teammates, a built-in icon library that auto-styles icons to match the active theme, gallery blocks (grid, logo-strip, and video-carousel layouts), anchor-linking between cards for single-page sites, password-protecting a site (useful for gated course content), automatic mobile/tablet responsive reflow, and exporting a Gamma doc as PNG/PDF/PowerPoint for social posts. As of this recording, Gamma could not revert a published site back into a regular document, duplicate a site directly (the workaround is copying all cards into a new document), or connect to no-code automation tools like Zapier.
Full video transcript
Gamma is up next — the website edition, live in the Gamma Lab as part of the Scale with AI Summit. Gamma is a platinum sponsor of the event, and the team built the entire Summit website on top of the product. Presenting are Deo and Allison, a Gamma designer who has worked across the product for about three years — AI, growth, and presentations included.
The day before, the group built a pitch deck together; today’s session builds a website in the same collaborative way. Hillary wants to open a small coffee shop in a container park and already has some information drafted in ChatGPT about what the site should include. She hands Allison a proposal doc to import.
Allison starts the generate flow: web page, continue, then chooses an image model. She prefers Ideogram and Flux Pro for consistency, having spent significant time testing AI image models while designing Gamma’s own image-generation features. The group votes on light versus dark theme — light wins this time (dark won the day before) — and Allison picks a cream color theme. Gamma generates a homepage, “Bean there, Brew that: a coffee community hub in the Container Park,” directly from the imported proposal.
The team adds a Contact Us section and a full menu page using the same repeatable generate flow used for the homepage — described as “rinse and repeat generation.” Allison edits the auto-drafted content, removing items that don’t fit (no breakfast menu yet, just pastries and baked goods), reordering sections so location and hours appear higher, and adding a seasonal pumpkin spice latte to the specialty drinks. When the AI-generated menu table looks underwhelming, she uses “Edit with AI” to request a different, more visual layout, switching to an icon-and-text smart layout and re-adding prices that were dropped in the regeneration.
A viewer asks whether Gamma actually built the site from the uploaded document — confirmed yes: the doc’s content was condensed and placed directly into the homepage. Another asks how to set up a new page on a site that already has a custom domain; Hillary takes over sharing to walk through domain setup live. Automatic domain setup runs through DNS verification, typically stated as 24–48 hours but often faster in practice; if you don’t already own a domain, Gamma offers purchasing one via its Ionos partnership without leaving the app.
Because Gamma doesn’t yet have a native form builder, the team embeds a separately built contact form using the /embed slash command, choosing whether it opens inline or in a new tab. Allison walks through card layout options — image position (top, left, right, behind), overlay effects (faded, frosted, clear) — settling on a faded overlay for legibility. A social media card is added using an icon layout, pulling built-in social icons (Instagram, LinkedIn) that automatically re-style to match the active theme. Instead of a phone number, they add an email button via a mailto: link, since picking up a phone mid-shift is impractical for a barista. Links, buttons, and embeds can be freely converted between each other depending on how the content should display.
Hillary demonstrates real-time collaborative commenting by tagging Allison directly on a page block — a workflow the team also used while planning the Summit itself. A viewer asks where the social icons come from: Gamma’s built-in icon pack, searchable with /icon, auto-styled to the current theme.
The conversation shifts to theme customization. Switching the whole site to a different theme (Stardust) regenerates images to match, though not every theme carries the same image style keywords. Deo notes a known gap: images generated under one theme don’t automatically restyle when the theme changes later, so the team currently runs “Edit with AI: regenerate all images to match my current theme” as a manual workaround; smarter auto-detection is on the roadmap. Custom themes can be built from scratch or based on an existing theme via the Customize panel, editing image style keywords, accent colors, and uploading a logo — which then appears automatically in the site’s footer.
Previewing the site across desktop, tablet, and mobile shows Gamma’s built-in responsive reflow, stacking horizontal sections vertically on small screens without any manual breakpoint work — a contrast Allison notes with her prior experience hand-building responsive sites in Webflow. After a brief mishap closing the browser mid-demo, the site is published, with a reminder that edits stay private until published.
Answering chat questions, the team covers: adding a Google Tag Manager ID under Site Settings for analytics, updating the favicon and site name, and toggling the nav bar off entirely for single-page “splash” sites. Page Setup (via the three-dot menu) controls how a page previews when shared on mobile or social. Asked about an in-site chatbot, the team says it’s a frequently requested feature, alongside Facebook Pixel integration, but not yet built — custom HTML/code embeds aren’t supported. They point to Canny, Gamma’s public feedback and changelog tool, where users can submit and upvote feature requests directly to the team; Gamma currently has about 25 employees, up from 12 when the core product shipped.
A viewer asks about embedding Typeform; Allison confirms it works by pasting the form link directly into a card, and the same paste-and-detect behavior applies to Calendly booking links, YouTube and Vimeo videos, and Figma embeds — Gamma auto-detects the link type and adjusts the block accordingly.
Time permitting, Allison walks through a personal site she built for her dog, Oro, demonstrating anchor links (built by copying a card’s link and pasting it into another block to create in-page jump navigation), an embedded GIF, large display type, and gallery blocks. Galleries support grid, logo-strip (auto-sized company logos), and video-carousel layouts, with adjustable spacing and fill settings. A quote/callout is built using a styled note box with the icon removed. Multi-video galleries let a viewer flip through clips like a course module list.
A question about side-by-side video-and-text layouts (not currently a built-in card type) is answered with a workaround: insert a blank card, add columns via /column, and place video in one column and text in the other, adjusting vertical alignment as needed.
For social media formatting, Page Setup includes a “social” display mode with square or portrait (story) aspect ratios, dynamic font scaling, and a dotted overflow guide showing when content exceeds the safe area — demonstrated on a Halloween social carousel Allison built, including a hacked two-column footer using small text and right alignment.
On exporting: Gamma supports PNG, PDF, and PowerPoint export, though gradient headings degrade to a single color in PDF/PowerPoint exports and custom fonts must be installed locally for PowerPoint. PNG export is called out as especially useful for social posts, downloading as a zip file.
Asked how creators are monetizing with Gamma, the team highlights course creation as a common use case, paired with a password-protection feature (in the share panel) that lets creators gate content behind a password shared only with paying customers — noted as not yet available for published sites but planned. The session closes with a reminder that the following day’s Gamma Lab, going live at 12 Central, will cover a different topic.