Figma to HTML, CSS, React & more! « Сайт по фигме, но автор отношения к ним не имеет! Not affiliated with Figma
Это не официальный сайт Figma / This is not the official site of Figma

Figma to HTML, CSS, React & more!Figma to HTML, CSS, React & more!

установить плагин для Фигмы Figma to HTML, CSS, React & more!

Плагин Figma to HTML, CSS, React & more! преобразует проекты Figma в высококачественные, адаптивные HTML, CSS, React, Vue.

Как это работает

  1. Установите плагин;
  2. В Фигме нажмите cmd(ctrl)+/, введите «html to figma» и нажмите Enter;
  3. Выберите слой, который хотите экспортировать, или введите URL-адрес, который хотите импортировать.

Для чего

  • Превратите дизайн в адаптивный HTML+CSS, React, Vue, Liquid, Solid и многое другое;
  • Быстро превращайте реальные компоненты сайта в компоненты дизайна;
  • Легко импортируйте живые стили сайта в качестве отправной точки для дизайна и прототипов.

Ограничения

Импорт HTML-слоев в Фигму и экспорт дизайнов в код — это процесс с максимальной эффективностью. Даже получение 90% может сэкономить вам массу времени, нужно только очистить несколько вещей.

Несколько известных ограничений

  • поддерживаются не все типы элементов (например, iframe, псевдоэлементы);
  • не все свойства CSS поддерживаются или полностью поддерживаются;
  • поддерживаются не все типы мультимедиа (видео, анимированные гифки и т.д.);
  • все шрифты должны быть загружены в Фигму, иначе будет использован запасной вариант;
  • Расширение для хрома
    Разработчик: Builder.io

    Плагины из той же категории