> ## Documentation Index
> Fetch the complete documentation index at: https://mintlify.com/gradio-app/gradio/llms.txt
> Use this file to discover all available pages before exploring further.

# Image

> Create image upload and display components in Gradio

The Image component allows users to upload or display images.

## Basic usage

```python theme={null}
import gradio as gr

def sepia(image):
    # Apply sepia filter
    return image

gr.Interface(fn=sepia, inputs=gr.Image(), outputs=gr.Image()).launch()
```

## Constructor

<ParamField path="value" type="str | PIL.Image | np.ndarray | Callable | None" default="None">
  Default image to display. Can be filepath, URL, PIL Image, or numpy array
</ParamField>

<ParamField path="format" type="str" default="'webp'">
  File format for saving (e.g., "png", "jpg", "webp")
</ParamField>

<ParamField path="type" type="Literal['numpy', 'pil', 'filepath']" default="'numpy'">
  Format passed to prediction function:

  * `"numpy"` - numpy array with shape (height, width, 3), values 0-255
  * `"pil"` - PIL Image object
  * `"filepath"` - string path to temporary file
</ParamField>

<ParamField path="sources" type="list[Literal['upload', 'webcam', 'clipboard']] | None" default="None">
  Input sources:

  * `"upload"` - File upload box
  * `"webcam"` - Webcam capture
  * `"clipboard"` - Paste from clipboard

  Defaults to all three if not streaming
</ParamField>

<ParamField path="image_mode" type="Literal['RGB', 'RGBA', 'L', ...] | None" default="'RGB'">
  PIL image mode. "RGB" for color, "L" for grayscale
</ParamField>

<ParamField path="height" type="int | str | None" default="None">
  Component height in pixels or CSS units
</ParamField>

<ParamField path="width" type="int | str | None" default="None">
  Component width in pixels or CSS units
</ParamField>

<ParamField path="streaming" type="bool" default="False">
  If True, automatically streams webcam feed in live interfaces
</ParamField>

<ParamField path="buttons" type="list[Literal['download', 'share', 'fullscreen'] | Button] | None" default="None">
  Buttons to display. By default, all built-in buttons are shown
</ParamField>

## Events

* **change** - Triggered when image changes
* **upload** - Triggered when image is uploaded
* **clear** - Triggered when image is cleared
* **stream** - Triggered during streaming
* **select** - Triggered when image is selected
* **input** - Triggered on input

## Examples

### PIL image input

```python theme={null}
import gradio as gr
from PIL import Image, ImageFilter

def blur_image(image):
    return image.filter(ImageFilter.BLUR)

gr.Interface(
    fn=blur_image,
    inputs=gr.Image(type="pil"),
    outputs=gr.Image(type="pil")
).launch()
```

### Webcam only

```python theme={null}
import gradio as gr

gr.Interface(
    fn=lambda img: img,
    inputs=gr.Image(sources=["webcam"]),
    outputs=gr.Image()
).launch()
```

### Grayscale images

```python theme={null}
import gradio as gr

gr.Image(
    image_mode="L",  # Grayscale
    label="Black and white image"
)
```


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