Нужен ли плагин Figma для конвертации дизайнов в HTML?

Поиск «figma to HTML without plugin» обычно означает одно из двух: вы не хотите ничего устанавливать или опасаетесь предоставлять стороннему инструменту доступ к своей учётной записи Figma. Оба побуждения разумны. Вот что на самом деле делают альтернативы без плагина и в чём они проигрывают.

Что обычно означает «без плагина»

Инструменты, обходящие шаг с плагином, получают данные вашего дизайна одним из двух способов:

• Публичная ссылка Figma + REST API Figma. Вы вставляете публичную (или общую) ссылку на файл, инструмент запрашивает OAuth-токен и через API Figma получает данные файла. Это работает, но означает предоставление токена, который может читать данные по всему вашему аккаунту или команде — гораздо больший объём доступа, чем передача одного фрейма.
• Скриншот или экспортированное изображение. Вы загружаете PNG или вставляете изображение, и модель ИИ для компьютерного зрения угадывает раскладку по пикселям. Здесь нет данных Auto Layout, нет реальных значений отступов, нет структуры компонентов — только предположение о том, как изображение, вероятно, выглядело бы в виде кода.

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

Чем на самом деле жертвует плагин взамен

Плагин Figma работает внутри собственного изолированного (sandboxed) API плагинов Figma. Он видит только тот файл, который у вас открыт, и отправляет данные только тогда, когда вы явно выбираете фрейм и экспортируете его — не весь ваш аккаунт, не другие проекты. Это более узкий объём доступа, чем у постоянного OAuth-токена, а не более широкий.

Взамен он получает настоящие данные: направление, gap и padding Auto Layout как реальные значения, ограничения масштабирования, структуру компонентов, стили текста и графические ресурсы — всё считано напрямую из дизайна, а не восстановлено по скриншоту. Это и есть разница между Auto Layout, чисто сопоставляемым с Flexbox, и моделью ИИ, угадывающей отступы по картинке.

Реальная цена установки плагина

Установка плагина Figma требует примерно тех же усилий, что и клик по ссылке: откройте файл, добавьте плагин из вкладки Community (или из приватных плагинов вашей команды) — и он появится в контекстном меню с этого момента. Вам не нужно покидать Figma, чтобы это сделать, и здесь нет отдельного экрана разрешений на уровне всего аккаунта, через который приходится проходить с веб-инструментами на основе OAuth.

Что выбирает MarkupGen

MarkupGen сознательно использует подход с плагином. Вы выбираете фрейм в Figma, отправляете его в своё рабочее пространство с помощью плагина, и ИИ генерирует HTML, CSS или Tailwind на основе реальной структуры дизайна — а не его скриншота. Если избежать одноразовой, ограниченной по объёму установки плагина — жёсткое требование для вашего рабочего процесса, инструмент на основе ссылки или скриншота — тот вариант, который подойдёт. Если же вы готовы обменять эту установку на разметку, действительно полученную из вашего дизайна, а не угаданную, — для этого и существует плагин.

Конвертируйте бесплатно — без привязки банковской карты.