Как экспортировать из figma

Если нужно быстро передать макет разработчику или подготовить графику для сайта, важно понимать, как экспортировать из figma без потери нужных слоёв и размеров. Ниже — практическая схема, которая помогает сохранить именно то, что требуется для работы, а не весь файл целиком.

Что можно экспортировать

В Figma экспортируют не сам проект, а отдельные объекты: фреймы, группы, слои, иконки, изображения и векторные элементы. Это удобно, когда часть макета нужна в PNG, часть — в SVG, а, например, иконку нужно отдать в нескольких масштабах.

Перед тем как запускать экспорт, проверьте, что выделено нужное место:

• Один слой — если нужен отдельный элемент;
• Фрейм — если нужен экран или блок целиком;
• Несколько объектов — если хотите получить набор файлов за один раз;
• Компонент или инстанс — если важно сохранить внешний вид конкретного элемента.

Если объект содержит маски, эффекты или сложные векторные формы, итоговый файл может отличаться от того, что видно на холсте. Поэтому лучше заранее открыть предпросмотр и убедиться, что в него попадает нужная область.

Пошаговый экспорт

Чтобы понять, как экспортировать из figma на практике, выделите объект на холсте и откройте правую панель свойств. Внизу найдите раздел Export. Если он свернут, раскройте его и нажмите плюс, чтобы добавить настройку экспорта.

1. Выберите объект или несколько объектов.
2. В разделе Export укажите формат: PNG, JPG, SVG или PDF.
3. При необходимости задайте масштаб: 1x, 2x, 3x или свой коэффициент.
4. Нажмите Export и сохраните файл в нужную папку.

Если нужно сохранить несколько вариантов одного и того же элемента, добавьте несколько пресетов экспорта. Например, можно сделать PNG для интерфейса и SVG для верстки. Для разных объектов настройки можно задавать отдельно, поэтому перед выгрузкой удобно проверить каждую строку в списке экспортируемых элементов.

Полезная проверка после сохранения: откройте файл и сравните его с макетом по размеру, прозрачности и четкости краёв. Если картинка выглядит размытой, обычно помогает более высокий масштаб или выбор SVG вместо растрового формата.

Как выбрать формат

Формат влияет на качество и удобство использования файла. Ошибка на этом этапе часто приводит к лишним пересохранениям, поэтому лучше сразу понимать, что именно нужно получить.

• PNG — для интерфейсов, скриншотоподобных блоков и прозрачного фона.
• JPG — для фотографий и тяжёлых изображений без прозрачности.
• SVG — для иконок, логотипов и простых векторных элементов.
• PDF — для передачи макетов, когда важна печать или просмотр в документах.

Если вы пытаетесь понять, как экспортировать из figma для разработки, чаще всего удобнее отдавать иконки в SVG, а крупные иллюстрации — в PNG в 2x или 3x. Для печати лучше проверять, подходит ли объект к нужному размеру без сильной потери качества.

Типичные проблемы и проверка результата

Иногда файл экспортируется не так, как ожидалось: обрезается тень, пропадает прозрачность или сохраняется лишний пустой отступ. Обычно это связано с границами выделения, масками или тем, что экспорт запускают не с того уровня вложенности.

Что стоит проверить:

• Нет ли скрытых слоёв внутри фрейма;
• Совпадает ли область экспорта с визуальными границами;
• Правильный ли формат выбран для задачи;
• Нужен ли прозрачный фон или белая подложка;
• Не слишком ли низкий масштаб для мелких деталей.

Если нужно выгрузить сразу несколько элементов, убедитесь, что у каждого задан свой экспорт, иначе Figma может сохранить только один объект или собрать их не так, как вы планировали. После сохранения лучше открыть результат и сравнить его с холстом по композиции и размеру.

Итог простой: как экспортировать из figma зависит от того, что именно вы отдаёте — отдельный слой, иконку, фрейм или готовый экран. Выберите объект, задайте формат, проверьте масштаб и сразу откройте итоговый файл, чтобы убедиться, что экспорт получился без искажений.