Repolode
Enviar
Nutlope

Nutlope/napkins

Uma ferramenta open source que transforma wireframes ou capturas de tela em apps funcionais, com Kimi K2.5 e Together AI.

Ver no GitHubSite
Estrelas
1,483
Forks
206
Issues abertas
6
Último commit
há 15 dias

O que é?

Napkins.dev é um gerador que transforma wireframes em apps. Você envia um esboço ou uma captura de tela de uma interface, e o app usa um LLM com capacidade de visão para gerar o código de um app funcional, que pode ser visualizado em um sandbox de código no navegador.

O projeto é feito com Next.js (app router) e Tailwind. Ele usa o Kimi K2.5 por meio do Together AI para inferência, executa o código gerado no Sandpack e armazena as imagens enviadas em um bucket S3. Para executá-lo localmente, é preciso ter uma API key do Together AI e credenciais do S3, ambas configuradas em um arquivo .env.

O trabalho planejado inclui melhorar o layout para dispositivos móveis, mostrar na barra lateral a saída do modelo de visão, editar o app gerado com um prompt complementar, permitir selecionar temas e manter um histórico de versões enquanto o app é editado.

Recursos principais

  • 01Converte um wireframe ou uma captura de tela em código de app usando o Kimi K2.5 por meio do Together AI.
  • 02Permite visualizar os apps gerados em um sandbox de código Sandpack no navegador.
  • 03Armazena as imagens enviadas no S3.
  • 04Feito com Next.js app router e Tailwind CSS.

Casos de uso

  • Transformar rapidamente um esboço de interface feito à mão em um protótipo executável.
  • Explorar como um LLM com visão traduz capturas de tela em código front-end.
  • Usá-lo como ponto de partida para um projeto com Next.js e Tailwind que você pode expandir.

Início rápido

  1. 1

    Clone o repositório

    git clone https://github.com/Nutlope/napkins
  2. 2

    Crie um arquivo .env e adicione sua chave de API do Together AI

  3. 3

    Crie um bucket do S3 e adicione as credenciais a .env usando os valores de .env.example

  4. 4

    Instale as dependências e execute localmente

    npm install && npm run dev

Antes de usar

  • É necessária uma chave de API paga do Together AI para gerar aplicativos.
  • É necessário configurar um bucket do S3 para armazenar imagens.

Tópicos

#ai#llm#code-generation#nextjs#wireframe#prototyping#typescript

Perguntas frequentes

O que é napkins?
Uma ferramenta open source que transforma wireframes ou capturas de tela em apps funcionais, com Kimi K2.5 e Together AI. Napkins.dev é um gerador que transforma wireframes em apps. Você envia um esboço ou uma captura de tela de uma interface, e o app usa um LLM com capacidade de visão para gerar o código de um app funcional, que pode ser visualizado em um sandbox de código no navegador.
napkins é gratuito? Qual é a licença?
napkins é open source sob a licença MIT. Confira os termos da licença antes de usá-lo em produtos comerciais.
napkins ainda é mantido?
Manutenção ativa. O último commit de napkins foi em 23 de out. de 2026.
Para que posso usar napkins?
Transformar rapidamente um esboço de interface feito à mão em um protótipo executável. Explorar como um LLM com visão traduz capturas de tela em código front-end. Usá-lo como ponto de partida para um projeto com Next.js e Tailwind que você pode expandir.
Como instalar napkins?
Clone o repositório: git clone https://github.com/Nutlope/napkins Crie um arquivo .env e adicione sua chave de API do Together AI Crie um bucket do S3 e adicione as credenciais a .env usando os valores de .env.example Instale as dependências e execute localmente: npm install && npm run dev
Onde consigo napkins?
O código-fonte e as instruções de instalação estão no GitHub: https://github.com/Nutlope/napkins

Resumo gerado por IA a partir do README do projeto. As estatísticas do GitHub são atualizadas diariamente.

Projetos relacionados