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

# Text Bubble

> Text Bubble — CometChat documentation.

`CometChatTextBubble` is the content view shown for [TextMessage](/sdk/react-native/send-message#text-message).

## Properties

| Properties | Type | Description |
| - | - | - |
| **text** | String | the text to display |
| **style** | [TextBubbleStyle](/ui-kit/react-native/v4/text-bubble#textbubblestyle) | used to customize appearance of this widget |

## TextBubbleStyle

`TextBubbleStyle` is the class containing attributes to customize appearance of this widget.

| Properties | Type | Description |
| - | - | - |
| **textFont** | FontStyle | used to set font style of the text of the message |
| **textColor** | string | used to set text colour of the message |
| **height** | number | used to set height |
| **width** | number | used to set width |
| **backgroundColor** | string | used to set background colour |
| **border** | BoxBorder | used to set border |
| **borderRadius** | double | used to set border radius |

## Usage

<Tabs>
  <Tab title="TypeScript">
    ```tsx theme={null}
    <CometChatTextBubble
      text='	Hi! how are you?',
      style={{
        backgroundColor: 'cyan'
        }}
    />
    ```
  </Tab>
</Tabs>


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