> ## Documentation Index
> Fetch the complete documentation index at: https://docs.workshop.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Build and Deploy Websites

> Build responsive, accessible websites from a description and publish them to a live URL — no templates, no page builders.

## What you'll build

A fully responsive, production-ready website — deployed to a live URL with a custom domain — built entirely by describing what you want in natural language.

## Before you start

<Steps>
  <Step title="Create a Workshop account">
    Sign up at [app.workshop.ai](https://app.workshop.ai) (free tier available). Workshop Cloud is the fastest path for websites, but Workshop Desktop works too.
  </Step>

  <Step title="Gather your reference material">
    Screenshots, URLs of sites you admire, brand colors, logos, and copy. The more context you give Workshop, the better the result.
  </Step>
</Steps>

## Step-by-step flow

<Steps>
  <Step title="Describe your website">
    Start a new conversation and tell Workshop what you want. Be specific about the type of site, its sections, and the audience.

    **Example prompts:**

    * *"Build a SaaS landing page with a hero section, feature grid, pricing table with monthly/annual toggle, testimonials, and an email waitlist form."*
    * *"Create a portfolio site with a filterable project gallery, about page, blog with markdown support, and a contact form. Use a minimal, modern design."*
    * *"Build a restaurant website with a browseable food menu organized by category, reservation booking form, photo gallery, and location map."*
  </Step>

  <Step title="Iterate on the design">
    Review the live preview and refine. You can ask Workshop to change specific sections without rebuilding the whole site.

    * *"Make the hero section taller with more whitespace."*
    * *"Change the color scheme to navy and gold."*
    * *"Add a dark mode toggle."*
    * *"Make the pricing cards stack vertically on mobile."*
  </Step>

  <Step title="Add interactivity and integrations">
    Go beyond static pages. Workshop can wire up forms, animations, and third-party services.

    * *"Connect the contact form to send emails via a backend endpoint."*
    * *"Add smooth scroll animations when sections come into view."*
    * *"Add a blog section that loads posts from markdown files."*
  </Step>

  <Step title="Publish your site">
    When you're happy with the result, click **Publish**. Workshop handles hosting and compute — you get a shareable URL immediately. You can make the site public or limit access to specific people or teams. Custom domains are available in settings.
  </Step>
</Steps>

## Tips and best practices

<AccordionGroup>
  <Accordion title="Reference real websites">
    Tell Workshop about sites you like: *"I want the layout to feel like Linear's homepage — clean, lots of whitespace, monospace accents."* References give Workshop a strong design direction.
  </Accordion>

  <Accordion title="Iterate section by section">
    Don't try to perfect the whole site in one prompt. Get the overall structure right first, then refine individual sections. This gives you more control and better results.
  </Accordion>

  <Accordion title="Think about responsive design early">
    Ask Workshop to show you the mobile view: *"Show me how this looks on a phone."* Catching layout issues early is much easier than fixing them at the end.
  </Accordion>

  <Accordion title="Provide your own copy">
    Workshop can generate placeholder text, but your site will be much stronger if you provide real headlines, descriptions, and CTAs. Paste your copy directly into the chat.
  </Accordion>

  <Accordion title="Accessibility matters">
    Ask Workshop to follow accessibility best practices: *"Make sure all images have alt text, use semantic HTML, and ensure the contrast ratio meets WCAG AA."*
  </Accordion>
</AccordionGroup>

## Next steps

* [Publishing and custom domains](/workshop-cloud/publishing) — Learn how to deploy and connect your domain
* [Sharing and teams](/workshop-cloud/sharing-and-teams) — Control who can access your site
* [Connectors](/connectors) — Connect databases, APIs, and more
* [Working with the Agent](/core-concepts/working-with-the-agent) — Prompting tips and communicating with Workshop
* [Checkpoints](/workshop-desktop/checkpoints) — Save and restore versions of your project (Workshop Desktop only)

***

<Card title="Start Building Free" icon="arrow-right" href="https://app.workshop.ai">
  Describe the website you want and watch it come to life.
</Card>