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

# Text Bubble

`CometChatTextBubble` is the content view shown for TextMessage.

## Properties

| Name      | Type                                                                | Description                                                                                  |
| --------- | ------------------------------------------------------------------- | -------------------------------------------------------------------------------------------- |
| text      | string                                                              | Text to be displayed                                                                         |
| textStyle | [TextBubbleStyle](/docs/ui-kit/angular/text-bubble#textbubblestyle) | Styling properties and values of the [Text bubble](/docs/ui-kit/angular/text-bubble) element |

## TextBubbleStyle

| Name      | Description                                                                                                                     |
| --------- | ------------------------------------------------------------------------------------------------------------------------------- |
| textFont  | Sets all the different properties of font for the text. [Reference link](https://developer.mozilla.org/en-US/docs/Web/CSS/font) |
| textColor | Sets the foreground color of the text.                                                                                          |

## Usage

<Tabs>
  <Tab title="HTML">
    ```html
    <!--use the element-->
    <cometchat-text-bubble
    [text]="'Hey, there!!'"
    ></cometchat-text-bubble>
    ```
  </Tab>
</Tabs>