# Images

Image layers let you add logos, graphics, and other visual elements to your layout. You can add up to eight image layers per layout.

In the app, you can import images from the Files app, the Photos app, or Simple Booth’s theme browser. Online, you can upload images from your file browser, drag and drop files, or choose from available themes.

***

#### Adding and Replacing Images

Once an image layer is added, you can manage the source file directly from the [**Inspector**](/copy-of-halo-app/layout-designer/layout-designer-overview.md#inspector-panel).

* **Image Source:** Tap the image preview in the Inspector to replace or swap in a different image at any time.
* **Canvas Controls:** When an image is selected, you can move, resize, copy, lock, or delete it directly on the Canvas.

***

#### Image Settings

Use these tabs to configure how your image fits and appears within the layout.

{% tabs %}
{% tab title="Content Mode" %}
Control how the image fits within its layer boundaries:

* **Fit:** Scales the entire image to fit inside the layer without cropping. This may leave empty space if the image’s aspect ratio doesn’t match the layer.
* **Fill:** Scales the image to completely fill the layer. Parts of the image may be cropped to maintain its aspect ratio. **Fill works best for most logos and graphics.**
* **Stretch:** Stretches the image to match the layer’s width and height. This can distort the image if the proportions are different.
  {% endtab %}

{% tab title="Border & Radius" %}
Adjust the frame's outline and corner shape:

* **Border:** Set the width and color using a hex code or the color picker.
* **Radius:** Adjust the roundness of the corners.
  {% endtab %}

{% tab title="Shadow" %}
Add depth to your design by offsetting a shadow behind the image:

* **Color:** Choose a shadow color and opacity.
* **Blur:** Adjust how soft or sharp the shadow appears.
* **Offset:** Move the shadow's position relative to the image.
  {% endtab %}

{% tab title="Opacity" %}
Control the transparency of the image. Lowering the opacity is useful for creating watermark effects or subtle background elements.
{% endtab %}
{% endtabs %}

***

{% hint style="success" %}

## **Plan availability**

✅ All plans
{% endhint %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.simplebooth.com/copy-of-halo-app/layout-designer/adding-layers/images.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.