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

# Connect a Custom Domain

> Use your own domain for your deployed Vibecode web app

Want to use your own domain instead of the default `.vibecode.run` URL? This guide walks you through connecting a custom domain to your deployed Vibecode web app.

## Before You Start

You'll need:

* A **deployed Vibecode web app** (see [Deploying Your Web App](/deploying/guide) if you haven't deployed yet)
* A **domain you own** with access to its DNS settings (e.g. via Cloudflare, GoDaddy, Namecheap, etc.)

## Step 1: Open the Domain Tab

In your deployment dashboard, click the **Domain** tab.

<img src="https://mintcdn.com/vibecodeapp/CAlhV8Cy6e50UFPv/deploying/custom-domain/01-domain-tab.png?fit=max&auto=format&n=CAlhV8Cy6e50UFPv&q=85&s=34a8fa21f07df5580e149fd80c3a9cf7" alt="Domain tab in the deployment dashboard" style={{ maxHeight: "400px", display: "block", margin: "0 auto" }} className="rounded-lg" width="1210" height="438" data-path="deploying/custom-domain/01-domain-tab.png" />

## Step 2: Add Your Domain

Click the **Add Custom Domain** button. You'll see a modal with two options.

<img src="https://mintcdn.com/vibecodeapp/CAlhV8Cy6e50UFPv/deploying/custom-domain/02-add-domain-modal.png?fit=max&auto=format&n=CAlhV8Cy6e50UFPv&q=85&s=ac75c6a3d02d4724ee404ce4bf5512a8" alt="Add Custom Domain modal with 'I have a domain' and 'Maybe later' options" style={{ maxHeight: "400px", display: "block", margin: "0 auto" }} className="rounded-lg" width="790" height="316" data-path="deploying/custom-domain/02-add-domain-modal.png" />

Click **"I have a domain"** to continue.

## Step 3: Enter Your Domain

Type in your domain name, just the domain, with no `http://` or `https://` prefix.

<img src="https://mintcdn.com/vibecodeapp/CAlhV8Cy6e50UFPv/deploying/custom-domain/03-enter-domain.png?fit=max&auto=format&n=CAlhV8Cy6e50UFPv&q=85&s=c4d454eb0e48ccc3f15623e340e767b3" alt="Domain input field with www redirect checkbox" style={{ maxHeight: "400px", display: "block", margin: "0 auto" }} className="rounded-lg" width="770" height="282" data-path="deploying/custom-domain/03-enter-domain.png" />

* Enter your domain (e.g. `example.com`)
* Optionally check **"Redirect www to this domain"** if you want `www.example.com` to redirect to your apex domain
* Click **Save**

## Step 4: Configure DNS Records

After saving, Vibecode shows you the DNS records you need to add at your domain provider. The exact records depend on whether you're connecting an **apex domain** or a **subdomain**.

<Tabs>
  <Tab title="Apex domain (e.g. example.com)">
    <img src="https://mintcdn.com/vibecodeapp/CAlhV8Cy6e50UFPv/deploying/custom-domain/04b-dns-records-apex.png?fit=max&auto=format&n=CAlhV8Cy6e50UFPv&q=85&s=5a9b85cde74809b35f651994d302f3a0" alt="DNS records for apex domain showing ALIAS and CNAME records" style={{ maxHeight: "500px", display: "block", margin: "0 auto" }} className="rounded-lg" width="743" height="863" data-path="deploying/custom-domain/04b-dns-records-apex.png" />

    | Type           | Name  | Target                        |
    | -------------- | ----- | ----------------------------- |
    | CNAME or ALIAS | `@`   | `<your-project>.vibecode.run` |
    | CNAME          | `www` | `<your-project>.vibecode.run` |
  </Tab>

  <Tab title="Subdomain (e.g. app.example.com)">
    <img src="https://mintcdn.com/vibecodeapp/CAlhV8Cy6e50UFPv/deploying/custom-domain/04-dns-records.png?fit=max&auto=format&n=CAlhV8Cy6e50UFPv&q=85&s=57e0f880324ac3602b499b7e604cb8da" alt="DNS records for subdomain showing CNAME records" style={{ maxHeight: "500px", display: "block", margin: "0 auto" }} className="rounded-lg" width="739" height="750" data-path="deploying/custom-domain/04-dns-records.png" />

    | Type  | Name      | Target                        |
    | ----- | --------- | ----------------------------- |
    | CNAME | `app`     | `<your-project>.vibecode.run` |
    | CNAME | `www.app` | `<your-project>.vibecode.run` |
  </Tab>
</Tabs>

<Note>
  The `www` record only appears if you enabled the www redirect in the previous step.
</Note>

<Tip>
  Some DNS providers don't support CNAME records on the apex domain (`@`). In that case, use an **ALIAS** or **ANAME** record instead.
</Tip>

## Step 5: Add Records at Your DNS Provider

Go to your DNS provider's dashboard and add the records from the previous step. Here are direct links to guides for popular providers:

<CardGroup cols={2}>
  <Card title="Cloudflare" icon="cloud" href="https://developers.cloudflare.com/dns/manage-dns-records/how-to/create-dns-records/">
    Create DNS records on Cloudflare
  </Card>

  <Card title="GoDaddy" icon="globe" href="https://www.godaddy.com/en-in/help/add-a-cname-record-19236">
    Add a CNAME record on GoDaddy
  </Card>

  <Card title="Namecheap" icon="globe" href="https://www.namecheap.com/support/knowledgebase/article.aspx/9646/2237/how-to-create-a-cname-record-for-your-domain/">
    Create a CNAME record on Namecheap
  </Card>

  <Card title="Google Domains" icon="google" href="https://support.google.com/domains/answer/9211383">
    Manage DNS records on Google Domains
  </Card>

  <Card title="Hostinger" icon="globe" href="https://www.hostinger.com/support/4738777-how-to-manage-cname-records-at-hostinger/">
    Manage CNAME records on Hostinger
  </Card>
</CardGroup>

## Step 6: Verify Your Domain

Once you've added the DNS records, go back to the Domain tab in Vibecode and click **Check now**.

<Note>
  DNS changes can take a while to propagate. If verification fails, wait a bit and try again.
</Note>

Once verified, you'll see a confirmation banner showing the domain is routed correctly. Click **Done** to finish, then deploy to activate your custom domain.

<img src="https://mintcdn.com/vibecodeapp/CAlhV8Cy6e50UFPv/deploying/custom-domain/06-domain-verified.png?fit=max&auto=format&n=CAlhV8Cy6e50UFPv&q=85&s=81df36ce8c41a69762bf186777c74523" alt="Domain verified confirmation showing routing is correct" style={{ maxHeight: "500px", display: "block", margin: "0 auto" }} className="rounded-lg" width="745" height="559" data-path="deploying/custom-domain/06-domain-verified.png" />

## Troubleshooting

<img src="https://mintcdn.com/vibecodeapp/CAlhV8Cy6e50UFPv/deploying/custom-domain/05-troubleshoot.png?fit=max&auto=format&n=CAlhV8Cy6e50UFPv&q=85&s=57a505b42a41425e2973cc8ab55dd831" alt="Troubleshoot section showing Cloudflare proxy tip" style={{ maxHeight: "500px", display: "block", margin: "0 auto" }} className="rounded-lg" width="748" height="806" data-path="deploying/custom-domain/05-troubleshoot.png" />

<AccordionGroup>
  <Accordion title="Cloudflare proxy conflict">
    If you're using Cloudflare, make sure the DNS record is set to **DNS-only mode** rather than **Proxied**.
  </Accordion>

  <Accordion title="A or AAAA record conflict">
    If you already have A or AAAA records pointing your domain somewhere else, they can conflict with the CNAME record. Remove the old records first.
  </Accordion>

  <Accordion title="DNS propagation delay">
    DNS changes do not take effect instantly. Wait a bit and try the verification again.
  </Accordion>

  <Accordion title="Need to start over?">
    You can click **Remove domain** in the Domain tab to disconnect your custom domain and start over.
  </Accordion>
</AccordionGroup>

<Note>
  Still stuck? Reach out via live support chat in the app, or join our [Discord community](https://discord.gg/qXyWYYX5Ts) for help.
</Note>
