Repolode
Enviar
GrapesJS

GrapesJS/grapesjs

Framework gratuito e open source para criar templates HTML e editores de páginas com recurso de arrastar e soltar, sem precisar programar.

Alternativa open source a:WixWebflow

Ver no GitHubSite
Estrelas
26,328
Forks
4,653
Issues abertas
30
Último commit
há 16 horas

O que é?

GrapesJS é um framework gratuito e open source para criar templates HTML visualmente, para uso em sites, newsletters ou aplicativos móveis. Ele foi desenvolvido principalmente para ser incorporado a um CMS, permitindo que usuários criem templates dinâmicos sem escrever código. Os templates são compostos por estrutura (HTML), estilo (CSS) e variáveis, preenchidas posteriormente no servidor e renderizadas no cliente.

O editor inclui um gerenciador de blocos, um gerenciador de estilos, um gerenciador de camadas, um visualizador de código e um gerenciador de assets. Há suporte a armazenamento local e remoto, além de comandos integrados para criar e gerenciar componentes. A distribuição é feita pelo npm, por CDNs como unpkg e CDNJS e pelo Git.

O núcleo pode ser estendido por meio de um sistema de plugins. O projeto também oferece um wrapper para React, presets para criadores de páginas e newsletters (MJML), além de vários plugins oficiais e da comunidade para componentes, armazenamento e propriedades de estilo.

Recursos principais

  • 01Gerenciador de blocos com recurso de arrastar e soltar para montar a estrutura da página
  • 02Gerenciador de estilos para editar visualmente o CSS dos componentes
  • 03Gerenciador de camadas e visualizador de código para inspecionar o template
  • 04Gerenciador de assets para lidar com imagens e outras mídias
  • 05Armazenamento local e remoto para salvar templates
  • 06Sistema de plugins com wrapper para React e presets para páginas e newsletters

Casos de uso

  • Adicionar um editor visual de páginas a um CMS para que pessoas sem conhecimentos de desenvolvimento criem templates
  • Criar templates de newsletters por e-mail com um editor de arrastar e soltar
  • Criar um construtor de sites no-code dentro do seu próprio aplicativo web

Início rápido

  1. 1

    Instale o GrapesJS pelo npm

    npm i grapesjs
  2. 2

    Inclua os arquivos CSS e JS e crie uma div contêiner com um script de inicialização, conforme mostrado no exemplo de uso do README

Tópicos

#web-builder#drag-and-drop#html-editor#visual-editor#no-code#cms#template-builder#framework#nocode#page-builder

Perguntas frequentes

O que é grapesjs?
Framework gratuito e open source para criar templates HTML e editores de páginas com recurso de arrastar e soltar, sem precisar programar. GrapesJS é um framework gratuito e open source para criar templates HTML visualmente, para uso em sites, newsletters ou aplicativos móveis. Ele foi desenvolvido principalmente para ser incorporado a um CMS, permitindo que usuários criem templates dinâmicos sem escrever código. Os templates são compostos por estrutura (HTML), estilo (CSS) e variáveis, preenchidas posteriormente no servidor e renderizadas no cliente.
grapesjs é gratuito? Qual é a licença?
grapesjs é open source sob a licença Other. Confira os termos da licença antes de usá-lo em produtos comerciais.
grapesjs ainda é mantido?
Manutenção ativa. O último commit de grapesjs foi em 21 de out. de 2026.
Para que posso usar grapesjs?
Adicionar um editor visual de páginas a um CMS para que pessoas sem conhecimentos de desenvolvimento criem templates Criar templates de newsletters por e-mail com um editor de arrastar e soltar Criar um construtor de sites no-code dentro do seu próprio aplicativo web
Como instalar grapesjs?
Instale o GrapesJS pelo npm: npm i grapesjs Inclua os arquivos CSS e JS e crie uma div contêiner com um script de inicialização, conforme mostrado no exemplo de uso do README
Onde consigo grapesjs?
O código-fonte e as instruções de instalação estão no GitHub: https://github.com/GrapesJS/grapesjs

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

Projetos relacionados