> ## Documentation Index
> Fetch the complete documentation index at: https://docs.sendbetter.co/llms.txt
> Use this file to discover all available pages before exploring further.

# Image Variable

> How to use dynamic image variables in the SendBetter editor

Image variables enable you to create templates where images can be dynamically swapped without changing the design structure. This is particularly useful when you need to generate multiple versions of a design with different images while maintaining the same layout and styling.

<img className="block" src="https://mintcdn.com/sendbetter/i_LkDvknhfT--9nK/images/editor-10.png?fit=max&auto=format&n=i_LkDvknhfT--9nK&q=85&s=20fb3ea7c236e157593d7be55c29ec3b" alt="Image showing how to set up and use image variables in the editor" width="1280" height="720" data-path="images/editor-10.png" />

## Creating Image Variables

### Define Variables

1. Open the Variables panel in the left sidebar
2. Click the `+` button to create a new variable
3. Select `Image` as the variable type
4. Provide:
   * Variable name
   * Default image URL (supports Google Drive shared links)

### Supported Formats

* JPEG/JPG
* PNG

## Applying Image Variables

### Set Variable Images

1. Select an image element in your design
2. In the right panel, locate the Image settings
3. Toggle the Variable switch to ON
4. Select your image variable from the dropdown
5. The image will update to show the default URL preview

### Best Practices

* Use direct image URLs
* Ensure Google Drive links are properly shared
* Verify image formats before setting variables

## API Integration

To change image variables when rendering, provide the new image URL as a query parameter: