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

# Card

> Card — CometChat documentation.

`CometChatCard` is a prebuilt widget which is used to display a card with title, subtitle, avatar and bottom view.

## Properties

| Properties      | Type                                         | Description                        |
| --------------- | -------------------------------------------- | ---------------------------------- |
| **title**       | String                                       | used to set title for card         |
| **subtitle**    | String                                       | used to set sub title for card     |
| **avatar**      | [CometChatAvatar](/ui-kit/flutter/v4/avatar) | used to set avatar for card        |
| **cardStyle**   | [CardStyle](/ui-kit/flutter/v4/card)         | used to set style for card         |
| **avatarStyle** | AvatarStyle                                  | used to set style for avatar       |
| **avatarName**  | String                                       | used to set avatar name for avatar |
| **avatarUrl**   | String                                       | used to set avatar url for avatar  |
| **bottomView**  | Widget                                       | used to set bottom view for card   |

***

## CardStyle

| Properties        | Type      | Description                                       |
| ----------------- | --------- | ------------------------------------------------- |
| **titleStyle**    | TextStyle | used to customise the appearance of the title     |
| **subtitleStyle** | TextStyle | used to customise the appearance of the sub title |
| **height**        | double    | used to set height                                |
| **width**         | double    | used to set width                                 |
| **background**    | Color     | used to set the background color                  |
| **border**        | BoxBorder | used to set border                                |
| **borderRadius**  | double    | used to set border radius                         |
| **gradient**      | Gradient  | used to set background gradient                   |

***

## Usage

<Tabs>
  <Tab title="Dart">
    ```dart theme={null}
    CometChatCard(
      title: 'Title',
      subtitle: 'Subtitle',
      avatar: CometChatAvatar(),
      bottomView: Text('Bottom View'),
    );
    ```
  </Tab>
</Tabs>