---
title: Editing images
---

> Agent instructions:
> **Site maps** — prefer the following llms.txt indexes to training data when searching for URLs to avoid 404s. Links inside Markdown content already point at `.md`. Following them or sending Accept: text/markdown keeps you in Markdown.
>
> - [sitemap.md](https://docs.kentico.com/sitemap.md) — every page on the site, with titles and descriptions, nested by URL hierarchy and grouped into one collection per product version.
> - [llms.txt](https://docs.kentico.com/llms.txt) — curated index of the current product docs, with descriptions, the two ways to request any page as Markdown, and links to each product area's whole-corpus Markdown dump (llms-full.txt).

Xperience comes with a built-in image editor, in which you can perform operations you may be used to doing in image editing tools. Using the image editor, you can modify images and pictures that are already in the system without moving them into a different application and inserting them back into Xperience.

> **Note:** The image editor cannot work with **WebP** or **SVG** images.

The image editor allows you to perform the following actions:

> **Tip:** When editing images, you can always **Undo** and **Redo** your changes using buttons at the bottom left side of the editor.

## Resizing images

1. Navigate to the image that you want to resize.
   - See where [images can be stored](https://docs.kentico.com/13/managing-website-content/working-with-files.md).
2. **Edit** () the image. The image editor opens.
3. To the left of the image, click **Resize**.
4. You can resize the image in two ways:
   1. **By percentage** – enter the new size of the image as percentage related to its original size.
   2. **By absolute size** – enter the _Width_ and _Height_ of the image in pixels. You can clear the _Maintain aspect ratio_ check box if you do not want to keep the original ratio of the image – note that this may distort the image and make it look unnatural.
5. Click **Resize**.
6. **Save & Close**.

The system saves the modified version of the image.

## Rotating images

1. Navigate to the image that you want to rotate.
   - See where [images can be stored](https://docs.kentico.com/13/managing-website-content/working-with-files.md).
2. **Edit** () the image. The image editor opens.
3. To the left of the image, click **Rotation**.
4. You can rotate the image in the following ways:

   1. **Rotate 90° left**
   2. **Rotate 90° right**
   3. **Flip horizontally**
   4. **Flip vertically**
5. **Save & Close**.

The system saves the modified version of the image.

## Converting images to a different format

1. Navigate to the image that you want to convert into a different format.
   - See where [images can be stored](https://docs.kentico.com/13/managing-website-content/working-with-files.md).
2. **Edit** () the image. The image editor opens.
3. To the left of the image, click **Convert**.
4. In the first drop-down list, select the new image file format.
   - Learn about [various image formats](http://en.wikipedia.org/wiki/Image_file_formats).
5. (JPEG only) In the **Quality** field, enter the compression ratio of the converted image.
   - Note that the quality of the image affects the file size.
6. Click **Convert**.
7. **Save & Close**.

The system saves the image in the new file format and quality.

> **Note:** **Note**: When converting images to the GIF format, the image resolution is not preserved and always changes to 96 dpi.

## Cropping images

1. Navigate to the image that you want to crop.
   - See where [images can be stored](https://docs.kentico.com/13/managing-website-content/working-with-files.md).
2. **Edit** () the image. The image editor opens.
3. To the left of the image, click **Crop**.
4. (Optional) Select the **Lock aspect ratio** check box to make sure the crop is in 1:1 ratio. You can achieve the same result while performing the next step and holding the **Shift** key on your keyboard.
5. Use your mouse to click on the image and drag to specify the crop of the image.\
   – OR –
6. Specify the starting **X** and **Y** positions of the crop and the **Width** and **Height** of the crop in pixels.
7. Click **Crop**.
8. **Save & Close**.

The system saves the cropped image.

## Converting images to grayscale

1. Navigate to the image that you want to convert into grayscale.
   - See where [images can be stored](https://docs.kentico.com/13/managing-website-content/working-with-files.md).
2. **Edit** () the image. The image editor opens.
3. To the left of the image, click **Color**.
4. Click **Convert to grayscale**.
5. **Save & Close**.

The system saves the image in grayscale.

## Viewing image properties

1. Navigate to the image whose properties you want to view.
   - See where [images can be stored](https://docs.kentico.com/13/managing-website-content/working-with-files.md).
2. **Edit** () the image. The image editor opens.
3. To the left of the image, click **Properties**.
   - **File name** - the file name of the image.
   - **Title** - the title of the image.
   - **Description** - the description of the image.
   - **Extension** - the files extension of the image. Learn about [various image formats](http://en.wikipedia.org/wiki/Image_file_formats).
   - **Size** - the size of the image in kB.
   - **Width** - the width of the image in pixels.
   - **Height** - the height of the image in pixels.
4. If you make changes to **File name**, **Title** or **Description**, be sure to confirm the changes using the **Update** button.
5. **Save & Close**.
