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

# Quickstart

> Go from sign-up to a live AI bot on your website in a few minutes.

This guide takes you from a new account to a working bot on your site. Chatref
does most of the heavy lifting – you paste your website, it builds and trains
your bot, and you add one line of code to go live.

<Tip>
  The website-first setup does most of the website step and the Playground test
  for you. When you give Chatref your URL, it builds your bot and starts learning
  your whole site automatically – so you may only need to test and deploy.
</Tip>

## Build your first bot

<Steps>
  <Step title="Create your account" icon="user-plus">
    Sign up for Chatref. You start with **\$50 of free trial credit**, so you can
    build and test your bot before paying anything.
  </Step>

  <Step title="Tell Chatref your website" icon="globe">
    On your first login, Chatref asks **"What's your website?"** Paste your URL
    and submit. Chatref reads your homepage and auto-builds your bot – its name,
    personality, welcome message, and suggested questions – then starts learning
    your whole site in the background.
  </Step>

  <Step title="Test it in the Playground" icon="comments">
    You land in the **Playground**, a live chat that uses your real settings.
    Type a question – like "What are your opening hours?" – and watch your bot
    answer. Tweak the personality or AI **Model** on the left if you like, then
    click **Deploy** to save.
  </Step>

  <Step title="Make it yours (optional)" icon="paint-roller">
    In **Settings**, set your brand colors, edit the welcome message, and add
    quick-action buttons – for example, a coffee store might add a **Track my
    order** button. Skip this for now if you're in a hurry.
  </Step>

  <Step title="Add it to your site" icon="code">
    Open the **Deploy** tab and copy the one-line script. Paste it into your
    site's HTML, just before the closing `</head>` tag.

    ```html theme={null}
    <script src="https://widget.chatref.ai/loader.js?apiKey=YOUR_API_KEY" async></script>
    ```

    Your bot now appears on every page of your site.
  </Step>

  <Step title="Watch it work" icon="chart-line">
    Read real conversations in the **Inbox** and track performance in
    **Insights** – including what your bot answered and what it couldn't, so you
    know what to add to your Knowledge Base next.
  </Step>
</Steps>

## Next steps

<CardGroup cols={2}>
  <Card title="Key Concepts" icon="book" href="/concepts">
    Learn the words behind Chatref – agent, Knowledge Base, widget, balance, and
    more.
  </Card>

  <Card title="Creating an Agent" icon="robot" href="/agents/creating-an-agent">
    Set up more bots, one per website or use-case, and explore each tab.
  </Card>
</CardGroup>
