> ## Documentation Index
> Fetch the complete documentation index at: https://cometchat-22654f5b-docs-llms-scoped-indexes.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Document Bubble

> Document Bubble — CometChat documentation.

## Overview

This element is a card view consisting of title, subtitle, url, icon and a launch button.

Properties

| Name | Type | Description |
| - | - | - |
| URL | string | URL of the element |
| title | string | Title of the element |
| subtitle | string | Subtitle of the element |
| buttonText | string | Text on the launch button |
| iconURL | string | Asset URL for the download icon |
| hideSeparator | boolean | When set to true, hides the separator which is displayed above the launch button |
| iconAlignment | [DocumentIconAlignment](/web-shared/documenticonalignment) | used to override click callback |
| documentStyle | [documentStyle](/ui-kit/react/v4/document-bubble#documentstyle) | Styling properties and values of the element |

## documentStyle

Styling properties and values of the element

| Name | Description |
| - | - |
| width | Sets the width of the element |
| height | Sets the height of the element |
| border | Sets the border of the element |
| borderRadius | Sets the border radius of the element |
| background | Sets all background style properties at once, such as color, image, origin and size, or repeat method. [Reference link](https://developer.mozilla.org/en-US/docs/Web/CSS/background) |
| iconTint | Sets the tint or color applied to the download icon of the element |
| separatorColor | Sets the color of the separator between individual items |
| titleFont | Sets all the different properties of font for the title text. [Reference link](https://developer.mozilla.org/en-US/docs/Web/CSS/font) |
| titleColor | Sets the foreground color of title text. |
| subtitleFont | Sets all the different properties of font for the subtitle text. [Reference link](https://developer.mozilla.org/en-US/docs/Web/CSS/font) |
| subtitleColor | Sets the foreground color of subtitle text. |
| buttonTextFont | Sets all the different properties of font for the text on the launch button. [Reference link](https://developer.mozilla.org/en-US/docs/Web/CSS/font) |
| buttonTextColor | Sets the foreground color of launch button text. |
| buttonBackground | Sets all background style properties at once, such as color, image, origin and size, or repeat method of the launch button. [Reference link](https://developer.mozilla.org/en-US/docs/Web/CSS/background) |

## Usage

<Tabs>
  <Tab title="HTML">
    ```html theme={null}
    <cometchat-document-bubble
       title={"Your Title"}
       URL={"URL"}
    ></cometchat-document-bubble>
    ```
  </Tab>
</Tabs>


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.