Frontender

Você marca uma camada ou um grupo inteiro e o plugin escreve o código daquela seleção. Não existe assistente de configuração nem etiqueta prévia para preparar. Esse é o ciclo principal, e explica por que a ferramenta parece mais um júnior do que uma janela de exportação.

O seletor traz só CSS, só CSS-in-JS, só Tailwind, HTML com CSS, HTML com Tailwind, JSX com CSS-in-JS e JSX com Tailwind. Quem precisa de um gerador de CSS para uma página antiga e quem quer um gerador de JSX para um app React usam o mesmo plugin, sem instalar duas ferramentas.

O Frontender entende classes Tailwind, não apenas CSS cru. Cole sua configuração e ele escreve com os seus nomes de classe, recorrendo a valores arbitrários quando nada da sua escala serve. Num fluxo de Figma para Tailwind, a marcação fica bem perto do que o time escreveria à mão.

O plugin não depende de autolayout nem de camadas bem nomeadas. Ele descobre ordem, hierarquia e sentido sozinho, então um arquivo mexido por três designers ainda rende estrutura utilizável. Quem já limpou um arquivo antes de exportar nota a diferença.

Os planos pagos acrescentam saída de componentes para React e Vue, então você recebe um componente reutilizável em vez de um bloco plano de marcação. Isso encurta o passo entre uma entrega de Figma para React e algo que dá para importar no repositório. O plano gratuito fica nos formatos básicos.

O código aparece no painel enquanto o plugin trabalha, e a cópia automática deixa o resultado na área de transferência para colar sem procurar botão. São detalhes pequenos que tiram os cliques repetidos de uma conversão em série.