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

# Изображения: добавление и настройка на лендинге

> Элемент Image в LanderLab: как добавить картинку из галереи или Unsplash, выбрать Fill или Fit, сдвинуть фокус, обрезать и задать размеры изображения.

Элемент Image позволяет добавлять на страницу визуальный контент: изображения продукта, иллюстрации или фоны.

Его можно перетащить из левой боковой панели и полностью настроить, как изображение выглядит и ведёт себя.

## Добавление и замена изображений

* Нажмите **Change Image** в правой панели
* Откроется модальное окно галереи изображений

В галерее вы можете:

* Выбрать из загруженных изображений
* Загрузить новые изображения
* Найти изображения в Unsplash

## Параметры размера изображения

Вы можете выбрать, как изображение вписывается в контейнер:

* **Fill** → заполняет всю область (часть изображения может быть обрезана)
* **Fit** → показывает изображение целиком без обрезки
* **Stretch** → растягивается под размер контейнера
* **Original** → сохраняет исходный размер изображения

## Положение изображения

Когда изображение выбрано, вы можете изменить, как оно располагается внутри контейнера.

* Используйте **элемент управления позицией (круг в центре)**, чтобы сдвинуть видимую область
* Пример:<br />если изображение обрезано, можно сместить фокус вверх, чтобы в кадре оказалось лицо, а не фон

## Размеры изображения

* Задавайте ширину и высоту вручную
* Используйте % или px в зависимости от вашего макета

## Управление изображениями

Всей библиотекой изображений можно управлять из галереи:

* Доступ ко всем загруженным изображениям
* Организация и повторное использование файлов
* Загрузка новых файлов в любой момент

## Обрезка изображений

В галерее изображения можно обрезать перед использованием:

* Выберите изображение
* Откройте инструмент обрезки
* Выберите соотношение сторон (1:1, 16:9 и т. д.)
* Примените обрезку

## Рекомендации

* Используйте оптимизированные изображения для более быстрой загрузки
* Сохраняйте единообразные размеры изображений в разных секциях
* Выбирайте Fit или Fill в зависимости от макета


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