# UI Components

The “AI Chat Site” can be added as a widget, accessed through a dedicated domain (e.g., ai.yoursite.com), or seamlessly integrated into your existing website via a URL.

## Widgets

The CleanDesk.AI widget is a visual component that appears on your website or application, enabling users to engage in real-time text-based conversations. It is typically accessed by clicking the launcher button that appears in the bottom corner of your webpage, allowing users to connect with our AI assistant and participate in conversations.

The launcher button can be customized and animated to give a catchy visual appearance, along with a Widget Invitation Text. The widget invitation will display the default welcome message unless changed.

#### Launcher Button

<figure><img src="/files/6A0x1lUOnvKXMug49Bys" alt=""><figcaption><p>Launcher Button is customisable</p></figcaption></figure>

CleanDesk.AI offers two types of UI through the widgets: **ChatBox** and **ChatSite**. By default ChatSite is selected. The ChatBox provides a smaller UI component that covers a lesser portion of your website, visible in the right side of your website. On the other hand, the ChatSite is a full-page UI that offers a visually impressive and more convenient experience for your audiences to receive better responses.

### Chat Site

<figure><img src="/files/OYZmY4oPFiNdyBVLeMMF" alt=""><figcaption><p>Chat Site mockup representation</p></figcaption></figure>

### ChatBox

<figure><img src="/files/ijRzre8wpMKy9c6KRmRs" alt=""><figcaption><p>ChatBox Mockup on your website Representation </p></figcaption></figure>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.cleandesk.ai/introduction/ui-components.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.