Monte READMEs profissionais para seus projetos do GitHub, bloco por bloco, com preview fiel ao GitHub.
Abrir o app · Reportar bug · Sugerir funcionalidade
Sumário
O README Builder é um editor visual para criar o README.md de repositórios do GitHub. Em vez de escrever Markdown na mão, você monta o documento com componentes (títulos, badges, imagens, tabelas, alertas, diagramas…), edita cada um num formulário e vê o resultado renderizado como o GitHub vai mostrar.
Tudo roda no navegador: não há servidor, conta nem banco de dados. O Markdown gerado é limpo, usa só o que o GitHub aceita e pode ser copiado ou baixado a qualquer momento.
JavaScript Vite Marked Mermaid KaTeX
- Editor por blocos: adicione componentes pela biblioteca, reordene arrastando, duplique, oculte ou recolha.
- Preview fiel ao GitHub: mesmo CSS, mesmas regras de HTML permitido, âncoras iguais e temas claro e escuro.
- Recursos do GitHub renderizados: alertas, notas de rodapé, emojis
:shortcode:, destaque de sintaxe, diagramas Mermaid e fórmulas matemáticas. - Componentes prontos: Hero, badges do Shields.io, imagem por tema, sumário automático, checklist, tabela, accordion, terminal e mais.
- Importação sem perdas: cole um README, envie um arquivo ou informe um repositório do GitHub; o que não vira componente é mantido como Markdown livre.
- Verificação antes de exportar: aponta links internos quebrados, HTML que o GitHub remove, imagens sem texto alternativo e pulos de nível nos títulos.
- Barra de formatação: negrito, itálico, código, links, teclas, emojis e notas de rodapé sem precisar saber Markdown.
Para usar, basta abrir o app publicado. Para rodar uma cópia na sua máquina, siga os passos abaixo.
- Node.js 20.19+ ou 22.12+
- npm 10 ou superior
git clone https://github.com/gui1535/readme-generator.git
cd readme-generator
npm install
npm run devNote
O servidor de desenvolvimento abre em http://localhost:5173. O app não salva o projeto: ao recarregar a página, ele volta ao README de exemplo.
- Clique em um componente na barra lateral (ou arraste-o) para adicioná-lo à estrutura.
- Abra o bloco e preencha os campos; o preview à direita atualiza na hora.
- Use Importar para começar a partir de um README existente.
- Clique em Verificar para revisar a compatibilidade com o GitHub.
- Use Copiar ou Baixar para levar o
README.mdpara o seu repositório.
| Comando | Descrição |
|---|---|
npm run dev |
Inicia o servidor de desenvolvimento |
npm run build |
Gera a versão de produção em dist/ |
npm run preview |
Serve localmente a versão de produção |
Cada push na branch main publica o site no GitHub Pages pelo workflow [deploy.yml](.github/workflows/deploy.yml). Em um fork, ative o Pages em Settings → Pages → Source: GitHub Actions.
- Editor por blocos com preview fiel ao GitHub
- Importação de README (texto, arquivo ou repositório)
- Mermaid, matemática, emojis e destaque de sintaxe no preview
- Verificação de compatibilidade com o GitHub
- Desfazer e refazer
- Biblioteca de seções prontas
- Badges dinâmicos (stars, versão do npm, CI)
- Dados do repositório preenchidos automaticamente
Veja as issues abertas para a lista completa de propostas e problemas conhecidos.
Contribuições são o que fazem a comunidade open source incrível. Qualquer ajuda é muito bem-vinda.
- Faça um fork do projeto
- Crie uma branch para a sua alteração (
git checkout -b feature/minha-feature) - Faça commit das mudanças (
git commit -m 'feat: adiciona minha feature') - Envie a branch (
git push origin feature/minha-feature) - Abra um Pull Request
Guilherme · @gui1535
Link do projeto: https://github.com/gui1535/readme-generator
Feito por Guilherme