> ## 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.

# Image Bubble

> Image Bubble — CometChat documentation.

`CometChatImageBubble` is the content view for a [MediaMessage](/sdk/flutter/send-message#media-message) if the media sent is an image.

## Properties

| Properties | Type | Description |
| - | - | - |
| **imageUrl** | String | the path of the image to display |
| **placeholderImage** | String | the path of the image from assets to display when the actual image is being fetched |
| **placeHolderImagePackageName** | String | the package of the asset image to display when the actual image is being fetched |
| **caption** | String | a text to display below the image |
| **style** | [ImageBubbleStyle](/ui-kit/flutter/v4/image-bubble#imagebubblestyle) | used to customize appearance of this widget |
| **theme** | [CometChatTheme](/ui-kit/flutter/v4/theme) | used to set custom theme |
| **onClick** | Function() | custom action on tapping the image |

***

## ImageBubbleStyle

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

| Properties | Type | Description |
| - | - | - |
| **captionStyle** | TextStyle | used to set style of the caption text |
| **height** | double | used to set height |
| **width** | double | used to set width |
| **background** | Color | used to set background color |
| **gradient** | Gradient | used to set a gradient background |
| **border** | BoxBorder | used to set border |
| **borderRadius** | double | used to set border radius |

***

## Usage

<Tabs>
  <Tab title="Dart">
    ```dart theme={null}
    CometChatImageBubble(
        theme: cometChatTheme,
        imageUrl:'https://data-us.cometchat.io/208434241880dc4d/media/1676951632_1179067617_0bb4ab5734e38db8b6fce07a5a912b84.jpg',,
        style: const ImageBubbleStyle(
            borderRadius: 8,
        )
    )
    ```
  </Tab>
</Tabs>


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